腾讯云开发者社区-腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

sktj

专栏作者

1542

文章

1902819

阅读量

34

订阅数

vue 数据绑定

var vm = new Vue({ 　 el : '#app', 　 data: { 　　 id : 1, 　　 index : 0, 　　 name : 'Vue', 　　 avatar : 'http://……' 　　 count : [1, 2, 3, 4, 5] 　　 names : ['Vue1.0', 'Vue2.0'], 　　 items : [ 　　　 { name : 'Vue1.0', version : '1.0' }, 　　　 { name : 'Vue1.1

2019-08-28

1.2K0

vue 生命周期

Vue.js 实例生命周期（原图出自于Vue.js 官网），如图2-2 所示。 init: 在实例开始初始化时同步调用。此时数据观测、事件等都尚未初始化。2.0 中更名为beforeCreate。 created ：在实例创建之后调用。此时已完成数据绑定、事件方法，但尚未开始DOM 编译，即未挂载到document 中。 beforeCompile: 在DOM 编译前调用。2.0 废弃了该方法，推荐使用created。 beforeMount: 2.0 新增的生命周期钩子，在mounted 之前运行。 compiled: 在编译结束时调用。此时所有指令已生效，数据变化已能触发DOM 更新，但不保证

2019-08-28

4570

<div id="app"> <nav class="navbar navbar-inverse"> <div class="container"> <div class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li> <!—使用 v-link 指令，path 的值对应跳转的路径，即#!/home --> <a v-link="{ path : '/home'}">Home</a> </li> <li> <a v-link="{ path : '/list'}">List</a> </li> </ul> </div> </div> </nav> <div class="container"> <!—路由切换组件template 插入的位置 --> <router-view></router-view> </div> </div> js 代码： // 创建子组件，相当于路径对应的页面 var Home = Vue.extend({ template : '<h1>This is the home page</h1>' }); // 创建根组件 var App = Vue.extend({}) // 创建路由器实例 var router = new VueRouter() // 通过路由器实例定义路由规则（需要在启动应用前定义好） // 每条路由会映射到一个组件。这个值可以是由Vue.extend 创建的组件构造函数（如Home） // 也可以直接使用组件选项对象（如'/list' 中component 对应的值） router.map({ '/home': { component: Home }, '/list': { component : { template: '<h1>This is the List page</h1>' } } }) // 路由器实例会创建一个Vue 实例，并且挂载到第二个参数元素选择器匹配的DOM 上 router.start(App, '#app')

2019-08-28

1.3K0

没有更多了

社区活动

RAG七天入门训练营

鹅厂大牛手把手带你上手实战

Python精品学习库

代码在线跑，知识轻松学

博客搬家 | 分享价值百万资源包

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

技术创作特训营·精选知识专栏

往期视频·千货材料·成员作品最新动态