入门vuejs

Vue.js基础教程


vuejs
1.载入vuejs文件
2.实例化vuejs
3.如何让vuejs显示hello world
    {{message}} 如果是属性就不用加双括号,直接加双引号
 var app = new Vue({
//        节点的id
        el:'#app',
        data:{
            message:'hello world111'
        }
    })
4.实现v-if,v-else,v-show
v-if="变量"  if(变量){} 
v-else="变量" else(变量){}//else和if必须成对出现,才会显示else的效果
v-show 直接显示
 <div v-if="isLogin" data="if">你好万佳佳</div>
    <div v-else="isLogin" data="else">你好万佳佳</div>
<div v-show="isLogin">你好万佳佳</div> 
var app = new Vue({
//        节点的id
        el:'#app',
        data:{
           isLogin:true


        }
    })
5.实现v-for
v-for=‘item in items’  for(items in item){}
v-for="(student,index) in students"    var index=1; for(students in student){
index++:student
}
   <div v-for="item in items">{{item}}</div>
    <div v-for="(student,index) in students">
        {{index+1}}:{{student.name}}</div>
 var app = new Vue({
//        节点的id
        el:'#app',
        data:{
          items:[25,23,32,53,26,77,85],
            students:[
                {name:"wanjiajia"},
                {name:"wanji"},
                {name:"wan"}
                ]
        }


    })
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值