如果子组件是一个弹窗,我们想通过点击关闭按钮来关闭子组件弹窗,子组件弹窗的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. Underscore.js实用插件

    Underscore 是一个 JavaScript 工具库,它提供了一整套函数式编程的实用功能,但是没有扩展任何 JavaScript 内置对象. 他解决了这个问题:“如果我面对一个空白的 HTML ...

  2. mysql建外键失败

    1. 修改引擎:(设计表-->选项-->引擎:InnoDB) 2. 检查外键类型是否一致:

  3. 团体程序设计天梯赛L1-023 输出GPLT 2017-03-22 17:56 39人阅读 评论(0) 收藏

    L1-023. 输出GPLT 时间限制 150 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 陈越 给定一个长度不超过10000的.仅由英文字母构成的 ...

  4. Python + HTMLTestRunner + smtplib 完成测试报告生成及发送测试报告邮件

    一下代码是自己结合教材,并结合以往用到的实例编写的代码,可以做为参考 import smtplib from email.mime.text import MIMEText from email.mi ...

  5. C# xsd 验证 XML数据有效性 问题

    使用XSD进行批量数据导入时生成的XML数据有效性这样的功能已经不是第一次做了,之前做的时候都没有碰到什么问题,这些天在开发中遇到了一个很头痛的问题就是无论XSD文件规则怎么写,验证都是通过的. 下面 ...

  6. Linux Guard Service - 前台进程和后台进程切换

    把一个正在执行的程序放入后台 [root@localhost 01]# Ctrl+Z 此使程序被移动到后台,但不能继续输出(处于暂停态) [root@localhost 01]# ./test1-1 ...

  7. 菜鸟的Xamarin.Forms前行之路——从新建项目到APP上架各种报错问题解决方法合集(不定时更新)

    出自:博客园-半路独行 原文地址:http://www.cnblogs.com/banluduxing/p/7425791.html 本文出自于http://www.cnblogs.com/banlu ...

  8. Linux的用户及权限相关

    sudo:用户想要使用sudo提升权限运行命令的话,需要把他加到sudo的list中 否则会报错:xxx is not in the sudoers file. 步骤 切换到root用户,运行visu ...

  9. 「HNOI 2013」数列

    题目链接 戳我 \(Solution\) 这道题貌似并不难的样子\(QAQ\) 我们发现这个因为有首项的关系所以有点不太好弄.所以我们要将这个首项对答案的影响给去掉. 我们可以构建一个差分数组,我们令 ...

  10. python 使用跨平台文件锁

    #encoding=utf-8 print '中国' #使用跨平台文件锁 import os if os.name == 'nt': import win32con,win32file,pywinty ...