vue.js 笔记

 

 

<!-- 多层for循环 -->
<ul>
  <li v-for="(ite,key) in list2">
    {{key}}-------{{ite.case}}
    <ul>
      <ol v-for="(vo,key) in ite.list">{{key}}------------{{vo.title}}</ol>
    </ul>
  </li>
</ul>

 

<!-- 图片链接输出 -->
<img :src="img" alt="">

 

<!-- style 控制 -->

<div class="box" v-bind:style="{width:boxWeight+'px',height:boxHeight+'px'}"></div>

 

<!-- 双向数据绑定 MVVM vue就是一个mNNM 的框架 -->
<!-- M model -->
<!-- v view -->
<!-- MVVM : model改变会影响view view视图改变会反过来影响 -->
<p>{{msg}}</p>
<input type="text" v-model="msg">

 

<!-- 事件绑定 -->

<!-- ref 获取document节点 -->
  <input type="text" ref="userinfo" />
<!-- 执行js方法两种方式 v-on:click @click -->
  <button v-on:click="getInputValue()" >获取ref=userinfo input数据</button>
  <div ref="boxBtn">box</div>
  <button @click="boxChange()">点击改变boxBtn style 属性</button>
<hr/>
  <ul>
    <li v-for="itema in adlist">{{itema}}</li>
  </ul>
  <button @click="addlist1()">点击按钮给list添加数据</button>
  <!--  js操作 -->

  this.adlist.push(给数组添加数据)
  this.adlist.splice(key,1)  从key开始移除, 移除1个

 


<hr/>
<!-- 方法传值 -->
<button @click="delfun('1111111122222')">给方法传值</button>
<hr/>
<!-- 事件对象 -->
<button @click="eventFn($event)" data-init="testData">事件对象</button>

 

转载于:https://www.cnblogs.com/jasonLiu2018/p/11067397.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值