实例属性 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>example 实例属性</title>
    <script type="text/javascript" src="js/vue.js"></script>
    <script type="text/javascript" src="js/jquery-3.2.1.js"></script>
</head>
<body>
    <div id="app">
        <p>{{message}}</p>
    </div>
    <div id="ppa"></div>
</body>
<script type="text/javascript">
    var app=new Vue({
        el:"#app",
        data:{
            message:'hello caicai'
        },
        mounted:function(){ //生命周期钩子函数，挂载   在整个实例生命内只执行一次。实时监控data数据变化，随时去更新dom    此时可以进行发送ajax请求获取数据的操作，进行数据初始化
            $("#app").html("我是jquery")   //在vue构造器里 使用jquery
        },
        methods:{
            add:function(){
                console.log('调用了构造器内部的add 方法');
            }
        }
    })
    app.add();  //在构造器外面 同个实例调用构造器内部方法
</script>
</html>

 

posted @ 2017-12-19 23:11  Jinsuo  阅读(142)  评论(0)    收藏  举报