zoukankan      html  css  js  c++  java
  • 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="{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>

  • 相关阅读:
    如何在VS2013中进行Boost单元测试
    C++项目中的extern "C" {}(转)
    C/C++语言中NULL、'’和0的区别
    关于C++“加、减机制”的整理
    C++继承中的public/protected/private
    Systemc在VC++2010安装方法及如何在VC++2010运行Noxim模拟器
    Testbench(转)
    Java高级特性之泛型
    Java高级特性之反射
    Java 输入输出流
  • 原文地址:https://www.cnblogs.com/jasonLiu2018/p/11067397.html
Copyright © 2011-2022 走看看