vue mixin混入 全局混入 局部混入

简介: vue mixin混入 全局混入 局部混入
  <div id="app">
        --{{nameName}}
    </div>
  // 全局混入  不需要注册
    var m1 = Vue.mixin({
        data() {
            return {
                nameName: "张三"
            }
        }
    })
   new Vue({
        el: '#app',
        data() {
            return {
                age: 20
            };
        },
    })


上一次一个同事,给我说你,可以看一下混入是怎么耍的,下来后我就去看了一下。


vue中的混入mixin,就是通过挂载到vue原型上去的。


所以不需要通过引入的方式,就可以直接使用


局部混入


<div id="app">
        {{nick11}}
    </div>
 // 局部混入  需要注册
    var m2 = {
        data() {
            return {
                nick11: "马云"
            }
        }
    }
    new Vue({
        el: '#app',
        mixins: [m2],//注册
        data() {
            return {
                age: 20
            };
        },
    })
相关文章
|
1天前
|
JavaScript
Vue的小知识点
Vue的小知识点
7 2
|
1天前
|
JavaScript Apache
Vue升级及版本不匹配解决_Vue packages version mismatch:
Vue升级及版本不匹配解决_Vue packages version mismatch:
7 1
|
1天前
|
JavaScript 定位技术
BIGEMAP地图VUE中引入
BIGEMAP地图VUE中引入
3 0
BIGEMAP地图VUE中引入
|
1天前
|
JavaScript
vue点击按钮复制文字到粘贴板
vue点击按钮复制文字到粘贴板
6 0
|
1天前
|
JavaScript 定位技术 开发者
vue项目使用腾讯地图获取定位
vue项目使用腾讯地图获取定位
4 0
|
1天前
|
JavaScript 开发者
如何新建一个vue+vant移动端项目
如何新建一个vue+vant移动端项目
6 0
|
5天前
|
前端开发 JavaScript
Vue底层实现原理总结
Vue底层实现原理总结
|
10天前
|
JavaScript 前端开发 测试技术
使用 Vue CLI 脚手架生成 Vue 项目
通过 Vue CLI 创建 Vue 项目可以极大地提高开发效率。它不仅提供了一整套标准化的项目结构,还集成了常用的开发工具和配置,使得开发者可以专注于业务逻辑的实现,而不需要花费大量时间在项目配置上。
71 7
使用 Vue CLI 脚手架生成 Vue 项目
|
1天前
|
JavaScript
Vue全局注册与局部注册异同点
Vue全局注册与局部注册异同点
12 6