VB.net 2010 視頻教程 VB.net 2010 視頻教程 VB.net 2010 視頻教程
SQL Server 2008 視頻教程 c#入門經典教程 Visual Basic從門到精通視頻教程
  • JavaScript教程之vue.js入門代碼

  • 2019-04-17 20:21 來源:未知
復制代碼
 魔兽世界wow www.geyjm.icu 
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
        [v-cloak]{/*網速比較慢可以用此命令隱藏msg*/
            display: none;
        }
    </style>
</head>
<body>
<div id="app">
    <p v-cloak>+++++{{msg}}-----</p><!--接受消息-->
    <h4 v-text="msg">==========</h4><!--接受消息-->
    <input type="button" value="點我啊" @click="btnHandler">
    <input type="button" value="傳送門" @click="ch">
    <a href="//www.baidu.com" @click.prevent="onclick">百度一下,不跳轉</a><!--阻止自動跳轉-->
    <a href="//www.baidu.com" @click="onclick1">百度一下,跳轉</a>
</div>
<!--引入vue.js-->
<script src="./WEB-INF/lib/vue.js"></script>
<script>
//創建Vue的實體
    var vm=new Vue({
        el:'#app',
        data:{
            msg: 'Hello Vue.js!'
        },
//方法的合集,都寫在此處
        methods:{
            onclick1(){
                alert("直接跳了")
            },
            onclick(){
              alert("阻止baidu的跳轉")
            },
            ch(){
                alert("傳送出來了")
            },
        btnHandler (){
            alert("顯示出來了")
        }
        }
    })
</script>
</body>
</html>
復制代碼
相關教程