zoukankan      html  css  js  c++  java
  • vuejs数据和事件

    <body>
      <div id='root'>{{number}}</div>
      <script>
        new Vue({
          el:'#root',
          data:{
            msg:'hello world',
            number:123
          }
        })
      </script>
    </body>
     
    数据写法
    {{number}} //这个语法我们把他叫做插值表达式,除了这种写法,还有两种写法
    <h1 v-text='number'></h1> //不编译html,引号内部是个变量
    <h1 v-html='number'></h1> //编译html
    事件
    <div id='root'>
      <div v-on:click="handleClick">{{content}}</div>
    </div>
    <script>
      new Vue({
        el:'#root',
        data:{
          content:'hello'
        },
        methods: {
          handleClick:function(){
            this.content = 'world';
          }
        }
      })
    </script>

    用指令v-on:click绑定,方法写在methods选项里面,在vue里面把hello变成world,之前要去改变dom,vuejs里面不用改变dom,直接改变数据就好了,this.content表示这个实例Vue里面data的content的数据

    v-on:click可以简写称@click
    <div @click="handleClick">{{content}}</div>



  • 相关阅读:
    HDUOJ----3342Legal or Not
    HDUOJ----2647Reward
    hduoj------确定比赛名次
    HDUOJ----1165Eddy's research II
    HDUOJ-----1556Color the ball
    HDUOJ-----2175取(m堆)石子游戏
    HDUOJ---------2255奔小康赚大钱
    HDUOJ------1711Number Sequence
    HDUOJ---1712 ACboy needs your help
    HDUOJ---1867 A + B for you again
  • 原文地址:https://www.cnblogs.com/wzndkj/p/9539954.html
Copyright © 2011-2022 走看看