如果子组件是一个弹窗,我们想通过点击关闭按钮来关闭子组件弹窗,子组件弹窗的v-show由变量isVisible控制,这个变量通过props由父组件来注入,

而子组件无法改变props里面的变量的值,但可以通过sync修饰来实现,代码如下:

子组件:

<button @click="close">关闭</button>
    export default {
props: {
isVisible: {
type: Boolean,
default: false
}
},
methods: {
close () {
this.$emit('update:isVisible', false);
}
}
};

父组件:

<chlid-component :isVisible.sync="isVisible"></chlid-component>

vue2.0修饰符sync用法的更多相关文章

  1. 理解vue 修饰符sync

    也是在vux中看到了这个sync 现在我们来看看vue中的sync 我们先看下官方文档:vue .sync 修饰符,里面说vue .sync 修饰符以前存在于vue1.0版本里,但是在在 2.0 中移 ...

  2. 深入理解vue 修饰符sync

    [ vue sync修饰符示例] 在说vue 修饰符sync前,我们先看下官方文档:vue .sync 修饰符,里面说vue .sync 修饰符以前存在于vue1.0版本里,但是在在 2.0 中移除了 ...

  3. 深入理解vue 修饰符sync【 vue sync修饰符示例】

    在说vue 修饰符sync前,我们先看下官方文档:vue .sync 修饰符,里面说vue .sync 修饰符以前存在于vue1.0版本里,但是在在 2.0 中移除了 .sync .但是在 2.0 发 ...

  4. vue 修饰符sync

    从 Vue 2.3.0 起,重新引入了 .sync 修饰符,作为一个编译时的语法糖存在.它会被扩展为一个自动更新父组件属性的 v-on 监听器. 实例: 父组件:<syTree :refillD ...

  5. const 和 readonly 修饰符的用法

    1. 只有C#内置类型(int,double,long等)可以声明为const;结果.类和数组不能声明为const. 2. readonly 是在字段上使用的修饰符,直接以类名.字段访问. 3. co ...

  6. C#中const 和 readonly 修饰符的用法详解

    1.const是不变常量,在编译的时候就需要有确定的值,只能用于数值和字符串,或者引用类型只能为null.(这里为什么要把字符串单独拿出来?是因为字符串string是引用类型,但是使用的时候却感觉是值 ...

  7. params修饰符的用法

    params修饰符是用来声明参数数组允许向方法传递数量不定的自变量用的.事实上System.Console 类的 Write 和 WriteLine 方法是参数数组用法的典型示例.他们的声明方式如下: ...

  8. java中修饰符及其用法

    1. java中的修饰符 a. 权限修饰符 private,默认的,protected,public b. 状态修饰符 static,final c. 抽象修饰符 abstract 2. 类修饰符 p ...

  9. Vue 修饰符sync的应用

    官方链接 https://cn.vuejs.org/v2/guide/components-custom-events.html#sync-修饰符 这个解释有点不太直观,用代码解释一下 父组件 v-b ...

随机推荐

  1. 编写高质量代码改善C#程序的157个建议——建议98:用params减少重复参数

    建议98:用params减少重复参数 如果方法的参数数目不定,且参数类型一致,则可以使用params关键字减少重复参数声明. void Method1(string str, object a){} ...

  2. XJOI 3601 技能(贪心+二分)

    题目描述: 有一个oier,他有n个算法技能,每个技能有一个水平值,每个技能的水平上限都是A,设这个oier有cnt个技能达到了A, 设所有水平值的最小值为mi,那么这个oier的战斗力为cnt×Cf ...

  3. GCT感受

    GCT考试已经结束了,但是复习GCT的时候一直没来得及总结点什么,GCT考的比较基础,所以复习起来并不是特别费力,但是还是有一些东西值得我们去学习的. 对于GCT考试,一开始在报名的时候其实心里是挺抵 ...

  4. <a>标签的用法以及[@text_cut]

    <a href="${a.url}" target="_blank">[@text_cut s=a.title len=titLen append= ...

  5. Android-Style样式

    说到Style样式在,HTML+Javascript+CSS中,CSS就是样式,样式可以把很多通用到效果,统一为一个样式,达到通用的目的,也可以让代码更加简洁. 什么时候用Style样式 ? 例如:A ...

  6. C# try catch finally

    抛出异常开销非常大(相对而言),所以不要过多的在程序中使用它们 既然finally一定是要执行的,即使try块中有return

  7. solidity 合约间调用以及参数传递

    在 以太坊中合约间是可以相互调用,并且正常进行参数传递以及返回值处理. contract1.sol pragma solidity ^0.4.0; contract Test1 { uint256 p ...

  8. sublime 插件安装之sublime highlight 如何优雅拷贝代码到word

      首先:打开preference => Package Control,输入 Add Repository ,用它来为Sublime 添加插件安装源, https://github.com/n ...

  9. 缺少libtool依赖导致编译安装失败

    今天安装一个测试数据库的过程中,编译安装rlwrap工具时出错. 如下. [root@DB1 rlwrap-0.37]# ./configure checking build system type. ...

  10. [AIR] 对存储器(Storage Volume)监听

    AIR 2.0及以上提供了对系统的存储器信息访问和监听的API.通过这些API,你不仅可以访问到硬盘文件系统,同时还可以监听通过USB或火线进行连接的移动存储设备,例如移动硬盘和以存储方式连接到计算机 ...