zoukankan      html  css  js  c++  java
  • vue之$root,$parent

    $root

    vue状态管理使用vuex,如果项目不大,逻辑不多,name我们没必要用vuex给项目增加难度,只需要用$root设置vue实例的data就行了,如下

    main.js

    new Vue({
      data(){
        return{
          loading:true
        }
      },
      router,
      store,
      render: h => h(App)
    }).$mount('#app')

    a.vue

    created(){
    console.log(this.$root.loading) //获取loading的值
    }

    b.vue

    created(){
    this.$root.loading = false; //设置loading的属性
    }
    

     

    $parent

    parent能够访问父组件的属性和方法

    parent.vue

    <template>
        <div>
            <child>
            </child>
        </div>
    </template>
    
    <script> 
        import child from './child';
        export default {
            components:{
                child 
            },
            data(){
                return {
                    text:"测试"
                }
            },
           
        }
    </script>

    child.vue

    <template>
        <div>
            <child>
            </child>
        </div>
    </template>
    
    <script> 
        import child from './child';
        export default {
            created(){
            console.log(this.$parent.text)//测试(能够获取到父组件的属性和方法)
           
         }
           
        }
    </script>
    
    
                

    $refs

  • 相关阅读:
    angular js 删除及多条删除
    angular js 页面修改数据存入数据库
    angular js 页面添加数据保存数据库
    angular js 分页
    内置函数和匿名函数
    装饰器,迭代器,生成器
    函数的进阶
    函数
    文件操作
    列表,字典
  • 原文地址:https://www.cnblogs.com/ttjm/p/10790370.html
Copyright © 2011-2022 走看看