vue.extend(),自己的小理解

1、Vue.extend()官网的解释

使用基础 Vue 构造器,创建一个“子类”。参数是一个包含组件选项的对象。

2、个人理解认识

 var myextend=Vue.extend({
 	template:'

......

'
, data(){} })

通过他构建出来的类似与一个模板对象,也可以说,他返回的是一个更像是一个构造函数,在需要使用的地方借助于·Vue.component() 生成一个组件,然后使用。就像是我们在JS中使用的构造函数,先定义好,然后在需要使用的地方new一下。
ps: 实例化extend构造器时,传入属性需要使用propsData,而不是props

<div id="todoItem">div>
<script>
   var todoItem = Vue.extend({
  data() {//这里必须使用方法
        return {
            todoData: [
              { id: 0, text: '张三' },
              { id: 1, text: '李四' },
              { id: 2, text: '王五' }
            ]
        }
  },
  props:['todoData'],
  template: `
        
  • {{ item.text }}
`
}); new todoItem({ propsData: {//这里必须使用propsData todoData: [ { id: 0, text: '花花' }, { id: 1, text: '花花' }, { id: 2, text: '花花' } ] } }).$mount('#todoItem')
script>

vue.extend(),自己的小理解_第1张图片

你可能感兴趣的:(vue)