在Vue.js中使用Mixin

const toggle = {

data() {

return {

isShowing: false

}

methods: {

toggleShow() {

this.isShowing = !this.isShowing;

}

const Modal = {

template: '#modal',

mixins: [toggle],

components: {

appChild: Child

}

};

const Tooltip = {

template: '#tooltip',

mixins: [toggle],

components: {

appChild: Child

}

};

你可以点击这里，查看 Sarah Drasner(@sdras) 在CodePen上编写 Mixin 的例子

为了更轻易懂得Mixin，这个例子有意编写得简单一些。真实应用中Mixin有如下的应用，然则它的感化也不仅限于此：获取视窗和组件的尺寸，采集特定的鼠标事宜和图表的根本元素。Paul Pflugradt 有一个关于 Vue Mixins 的优良项目，值得一提的是它是用 coffeescript 编写的。

用法

你可以按照你爱好的随便率性方法设置你的目次构造，但为了构造规整我爱好新建一个mixin目次。我们创建的┞封个文件含有.js扩大名(跟.vue相对，就像我们的其他文件)，为了应用Mixin我们须要输出一个对象。

接着我们可以在Modal.vue应用如许的写法，来惹人这个Mixin:

import Child from './Child' 
 
import { toggle } from './mixins/toggle' 
 
  
 
export default { 
 
  name: 'modal', 
 
  mixins: [toggle], 
 
  components: { 
 
    appChild: Child 
 
  } 
 
} 	
			 2/4   首页 上一页 1 2 3 4 下一页 尾页	
			

　　推荐阅读
　　如何改变数字化转型前后的管理观念
(1)企业已经是一个数字实体，如不雅想大年夜中获益，就由本身决定。查看竽暌姑户应用的是什么设备?他们有两种或多种办法可以连接到营业体系中吗?最重要的是，企业是在做什么来许可或优化他们的经验吗?企业的用户已经>>>详细阅读


本文标题：在Vue.js中使用Mixin
地址：http://www.17bianji.com/lsqh/36223.html
 1/2    1