关于Vue2.0那些事_1

Vue2.0针对Vue1.0做出了部分改进,在官网上对于项目的迁移也做了较大的支持。
Vue2.0 文档:https://vuefe.cn/guide/
Vue1.x的迁移方法等:https://vuefe.cn/guide/migration.html

在迁移的方法中介绍了对于1.0版本的改进。可以详细的阅读。本文主要针对你vue-cli脚手架工具编译后的记录与探究。

使用Vue脚手架进行项目的搭建大家可以参考:https://github.com/vuejs/vue-cli 。在安装是目前会自动安装2.0版本的Vue,如需安装1.0版本的可以更改package.json中的dependencies的设置。此时只需将大版本好改为1即可,即可安装1.x.x的最新版

  "dependencies":{
      "vue": "^1.0.1"
     },

在2.0版本中index.html中区别于1.0中的版本如下

<div id="app"></div> //2.0
<app></app> //1.0

相应的main.js中的文件如下

        import App from './App' 
        new Vue({   //2.0
           el: '#app',
           template: '<App/>',
           components: { App }
        })

       new Vue({  //1.0
           el: 'body',
           components: { App }
        })

当我们将2.0中代码转化成1.0中的代码的时候出现如下 禁止代码的在html与body上挂载。
这里写图片描述

我们将app外围包裹一层div时候在挂载在即可正常的展示

    <div id="app"><app></app></div>

其实在2.0中建议将片断的实例进行包裹。这里设置template将直接覆盖之前的index中div标签。等价于局部注册的使用只在父模板中使用

 var App = {
      template: '<div>....</div>'
         }
  new Vue({
      // ...
      components: {
        'App': App
      }
  })
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值