简单介绍
- 可以把多个组件共有的数据，方法，提取成一个混合文件
- data中数据自己和混合文件都有时，以自己的数据为主
- 生命周期还有方法这些都是独立的
// 这样引入所有的页面，组件都会使用这个混合
import mixin from './components/mixin/mixin'Vue.mixin(mixin)局部混合
// 常用引用方式
// mixin.jsexport default {
data() {
return {
mixData: '这是mixin中数据',
x: 100,
}
},
created () {
console.log(this.y)
},
methods: {
handleClick() {
console.log(this.name)
}
},
computed: {
showNumber() {
return this.x + this.y
}
}
}// 两个需要引用混合的组件// Student.vue
{{ msg }}
姓名：{{name}}
年龄：{{age}}
数字：{{showNumber}}// School.vue
{{ msg }}
姓名：{{name}}
地址：{{address}}
数字：{{showNumber}}推荐阅读
- JavaScript|vue 基于axios封装request接口请求——request.js文件
- vue.js|vue中使用axios封装成request使用
- vue.js组件开发
- 前端开发|Vue2.x API 学习
- javascript|vue使用js-xlsx导出excel，可修改格子样式，例如背景颜色、字体大小、列宽等
- vue.js|后端开发学习Vue(一)
- JS|VUE学习笔记[30-46]
- vue.js|Vue为何弃用经典的Ajax，选择自研Axios（）
- vue|vue3替代vuex的框架piniajs实例教程
- cmd配置npm仓库镜像报错