Vue實例的屬性

Vue實例的屬性

$el: 獲取到vue實例掛在的元素對象
$options : 當前實例的一些參數
$refs : 可以用來獲取DOM元素;
$set : 向data中的對象新增鍵值對
$delete: 刪除屬性
$destroy : 銷燬實例
$mount: 掛載
$on : 訂閱
$emit : 發佈
$off :移除
$nextTick : 用於DOM的異步更新;

<body>
    <div id="app">
        <!-- ref重名後面的元素會把前面的覆蓋掉 -->
        <div ref="a"></div>
        <span ref="a"></span>
        {{msg.a}}
        <button @click="fn"></button>
    </div>
    <script src="../node_modules/vue/dist/vue.js"></script>
    <script>
        let  vm = new Vue({
            el:"#app",
            data:{
                msg:{
                   a
                }
            },
            methods:{
                fn(){
                    // this.refs.a
                    // 如果更改對象中的屬性名對象的屬性值,視圖會進行更新的
                     this.msg.a=200;
                    // $set : 給data中的對象新增鍵值對的,這樣可以監聽到新增的數據
                    //vm.$set(vm.msg,"a",200)
                }
            }
        });
        console.log(vm);
        // $el: 獲取到vue實例掛在的元素對象
        // $options : 當前實例的一些參數
        // $refs : 可以用來獲取DOM元素;
        // $set : 向data中的對象新增鍵值對
        // $delete: 刪除屬性
        // $destroy : 銷燬實例
        // $mount: 掛載
        // $on : 訂閱
        // $emit : 發佈
        // $off :移除
        // $nextTick : 用於DOM的異步更新;
    </script>
</body>
</html>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章