Vue之mixin混入詳解
更新時間：2021年11月21日 11:33:56 作者：王同學要努力
這篇文章主要為大家介紹了Vue之mixin混入，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助
?
局部混入
<template>
<div>
<h2 @click="showName">學生姓名：{{name}}</h2>
<h2>學生性別：{{sex}}</h2>
</div>
</template>
<script>
//引入一個混合
import {
hunhe,hunhe2
} from '../mixin'
export default {
name: 'Student',
data() {
return {
name: '張三',
sex: '男'
}
},
mixins: [hunhe,hunhe2]
}
</script>
export const hunhe = {
methods: {
showName() {
alert(this.name)
}
}
}
export const hunhe2 = {
data() {
return {
x: 100,
y: 200
}
}
}
全局混入
import { hunhe, hunhe2 } from './mixin'
Vue.mixin(hunhe)
Vue.mixin(hunhe2)
總結
本篇文章就到這里了，希望能夠給你帶來幫助，也希望您能夠多多關注腳本之家的更多內容!
相關文章
vue引入新版 vue-awesome-swiper插件填坑問題
這篇文章主要介紹了vue引入新版 vue-awesome-swiper插件填坑問題，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-01-01
這篇文章主要給大家介紹了關于vue圖片懶加載代碼實現(xiàn)的相關資料,所謂圖片懶加載是指當我們?yōu)g覽頁面時,只加載我們?yōu)g覽器可視區(qū)的圖片,向下滾動時再繼續(xù)加載后面的圖片,需要的朋友可以參考下2023-07-07
這篇文章通過實例代碼給大家介紹了vue項目中添加electron的方法，代碼簡單易懂，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友參考下吧2021-11-11
這篇文章主要介紹了關于vue-tree-chart簡單的使用方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-08-08
vue移動端使用appClound拉起支付寶支付的實現(xiàn)方法
這篇文章主要介紹了vue移動端使用appClound拉起支付寶支付的實現(xiàn)方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-11-11
本文主要介紹了vue中的可拖拽寬度div的實現(xiàn)示例，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-04-04
這篇文章主要為大家介紹了Vue watch偵聽器，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2021-12-12
vant/vue手機端長按事件以及禁止長按彈出菜單實現(xiàn)方法詳解
這篇文章主要介紹了vant/vue手機端長按事件以及禁止長按彈出菜單實現(xiàn)方法詳解,需要的朋友可以參考下2022-12-12
我們知道使用webpack打包vue項目后會生成一個dist文件夾,dist文件夾下有html文件和其他css、js以及圖片等,那么打包后的文件該如何正確運行呢?這篇文章主要給大家介紹了關于vue打包之后的dist文件如何運行的相關資料,需要的朋友可以參考下2023-05-05
關于Element上傳組件beforeUpload上傳前限制失效問題
這篇文章主要介紹了Element上傳組件beforeUpload上傳前限制失效問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-03-03