位置:电子教程 > Vue.JS入门教程 (如果看不到内容请使用360浏览器) 推荐学习资源
Vue.js入门
Vue.js 数据绑定
Vue.js中的指令
Vue.js 表单和双向数据绑定
Vue.js 条件和循环指令
Vue.js 循环语句v-for
Vue.js 样式绑定
Vue.js 事件处理器
Vue.js 监听属性
Vue.js 计算属性
Vue.js 组件 Component
Vue.js 自定义指令
Vue.js 路由
Vue.js 过渡和动画
Vue.js 响应接口
Vue.js中Ajax(Axios)
当前阅读教程:Vue.JS入门教程 > 入门知识点总结
阅读(22555525)      收藏       赞(5685)      分享
上一篇: 示例-前缀 $ 的使用 下一篇: Vue.js 数据绑定

知识点:Vuedata数据的第2种定义方式

我们可以先定义一个对象,将内容赋值在对象里面,然后讲对象赋值给Vue中的data。示例

小白教程网www.2d5.net

代码如下:

var duixiang = { site: "大学课堂", url: "www.123.com", alexa: 10000}
var vm = new Vue({
    el: '#vue_det',
    data: duixiang
})

 

知识点:Vuedata数据的改变和设置方式1

var myvue = new Vue({
     el:"#myapp001",
     data:{
             site:"大学课堂",
             url:"www.123.com"
     },
     methods:{
             cs:function(){
                      return "你好," + this.url;
             }
     }
})

如何改变

myvue.site = "腾讯"

知识点:Vuedata数据的改变和设置方式2

var duixiang = { site: "大学课堂", url: "www.123.com", alexa: 10000}
var vm = new Vue({
    el: '#vue_det',
    data: duixiang
})
vm.site = "腾讯"
duixiang .site = "百度"
知识点:原生JS如何输出Vue中的data数据
document.write(vm.alexa)

知识点:Vue中的系统属性的使用

除了数据属性,Vue 实例还提供了一些有用的实例属性与方法。它们都有前缀 $,以便与用户定义的属性区分开来。

<script>
     var shuju={xing:"黄",ming:"菊华",dianhua:"13516821613"}
     var v = new Vue({
             el:"#app",
             data:shuju
     })
     document.write(shuju);
     document.write(v.$data);
     document.write(v.$data===shuju);
</script>

 


上一篇: 示例-前缀 $ 的使用 下一篇: Vue.js 数据绑定
毕业设计网             广告联系QQ:45157718(微信同号)