zoukankan      html  css  js  c++  java
  • vue—子组件修改父组件的值

    如何在子组件中修改父组件的值

    第一步:首先得保证父组件中有值吧
    这是userManage.vue 
    1 data(){
    2     return{
    3         dialogCreate:'false'
    4     }
    5 }
    第二步:在父组件中引用子组件
    1 import Form from './userCreate'
    第三步:父组件中注册子组件并引用
    <template>
        <app-form></app-form>
    </template>
    
    <script>
        export default{
            name:'user',
            components:{
                "app-form":Form
            },
            data(){
                return{
                    dialogCreate:'false'
                }
            }
        }
    </script>
    第四步:把父组件的值绑定给子组件上 
    1 <app-form v-bind:dialogCreate = "dialogCreate" ></app-form>
    第五步:既然父组件把值给了子组件了,子组件得接受和用吧
    
    子组件
    1.先接收
    export default{
        props:['dialogCreate']
    }
    2.就可以直接在自组建中用了
    <p>{{dialogCreate}}</p>
    第六步:向父组件发射一个方法 
    this.$emit('success',false);
    第七步:父组件接收到这个方法并且执行改变父组件的值
    
    <app-form v-bind:dialogCreate = "dialogCreate" v-on:success="success(res)"></app-form>
    
    methods: {
         check(){
             alert(1);
         },
         success(res){
            this.dialogCreate = res;
         }
    }

      

  • 相关阅读:
    数据库事务的四大特性
    MySQL数据库高可用性架构
    java中几种访问修饰符
    zookeeper的leader选举
    zookeeper的集群部署步骤
    MySQL索引设计原则
    SpringMVC框架知识点详解
    Spring框架知识点详解
    JAVA之DAY1
    JDK
  • 原文地址:https://www.cnblogs.com/wuliujun521/p/14545188.html
Copyright © 2011-2022 走看看