VUE学习-第二个DEMO（模板语法）

<div id="app">
    <h1>双括号表达式</h1>
    <p>{{msg}}</p>
    <p>{{msg.toUpperCase()}}</p>    <!----textcontent--->
    <p v-text="msg"></p>          <!----textcontent--->
    <p v-html="msg"></p>          <!---innerHTML------>
    <h1>强制数据绑定</h1>
    <img src="imgUrl">
    <img v-bind:src="imgUrl"  width="100" height="100">
    <img :src="imgUrl"  width="100" height="100">  <!---简写-->
    <h1>绑定事件监听</h1>
    <button v-on:click="test">test1</button>
    <button @click="test2(msg)">test2</button>
</div>

<script>
    new Vue({
        el:"#app",
        data:{
            msg:"<a href='#'>I love bigV!</a>",
            imgUrl:"https://cn.vuejs.org/images/logo.png"
        },
        methods:{
            test() {
                alert("大V!!")
            },
            test2(la){
                alert(la)
            }
        }
    })
</script>