Vue.extend的用法

 Vue.extend用于基于Vue构造器创建一个Vue子类,可以对Vue构造器进行扩展。它有一个options参数,表示包含组件选项的对象。下面我们通过例3-3演示Vue.extend的使用。

  【例3-3】

  (1)创建C:Users/itcast/Desktop/demo03.html文件,具体代码如下:

在上述代码中,第4行的Vue.extend()方法返回的Vue2就是Vue的子类;第5~7行用于为新创建的Vue2实例添加data数据,由于此时Vue2实例还未创建,所以要把数据写在函数的返回值中;第1行的title在vml中不存在,代码在执行时会报错,如果报错,就说明第5~7行代码只对Vue2有效,原来的Vue不受影响。

  (2)在浏览器中打开demo03.html文件,运行结果如图3-3所示。

  图3-3 Vue.extend

在图3-3所示的页面中,appl对应Vue的实例vml,app2对应Vue2的实例vm2,从运行结果可以看出,在vm2中添加了初始数据hello,vml不受影响。并且在控制台中会看到title属性未定义的提示。

你可能感兴趣的:(Vue.extend的用法)