Vue.js基础知识小结

数据绑定

目前创新互联已为数千家的企业提供了网站建设、域名、虚拟主机、网站改版维护、企业网站设计、鄂伦春网站维护等服务，公司将坚持客户导向、应用为本的策略，正道将秉承"和谐、参与、激情"的文化，与客户和合作伙伴齐心协力一起成长，共同发展。

1.单向绑定


  {{massage}}

var app = new Vue({
el:"#app",
data:{
message:"Hello,vue.js!"
}

2.双向绑定


 {{message}}


var app = new Vue({
el:"#app",
data:{
message:"Hello,vue.js!"
}

3.v-for列表渲染


    
      
       {{ todo.text }}
      
    

new Vue({
   el:"#app",
   data:{
      todos:[
       {text:"abcdef"},
       {text:"123456"},
       {text:"qwerta"}
    ]  }
})

3.处理用户输入


  {{ message }}
  

new Vue({
   el: "#app",
   data:{
    message:"Hello Vue.js!"  
   },
   methods:{
    reverseMessage:function()
    {
      this .message = this.message.split('').revserse().join('');
    }
  }
})

4.综合


 
 
 
  {{ todo.text }}

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持创新互联！

本文名称：Vue.js基础知识小结
文章起源：http://wjwzjz.com/article/pijedp.html

新网创想网站建设，新征程启航

Vue.js基础知识小结

其他资讯