vue2.0修饰符sync用法
如果子组件是一个弹窗,我们想通过点击关闭按钮来关闭子组件弹窗,子组件弹窗的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用法的更多相关文章
- 理解vue 修饰符sync
也是在vux中看到了这个sync 现在我们来看看vue中的sync 我们先看下官方文档:vue .sync 修饰符,里面说vue .sync 修饰符以前存在于vue1.0版本里,但是在在 2.0 中移 ...
- 深入理解vue 修饰符sync
[ vue sync修饰符示例] 在说vue 修饰符sync前,我们先看下官方文档:vue .sync 修饰符,里面说vue .sync 修饰符以前存在于vue1.0版本里,但是在在 2.0 中移除了 ...
- 深入理解vue 修饰符sync【 vue sync修饰符示例】
在说vue 修饰符sync前,我们先看下官方文档:vue .sync 修饰符,里面说vue .sync 修饰符以前存在于vue1.0版本里,但是在在 2.0 中移除了 .sync .但是在 2.0 发 ...
- vue 修饰符sync
从 Vue 2.3.0 起,重新引入了 .sync 修饰符,作为一个编译时的语法糖存在.它会被扩展为一个自动更新父组件属性的 v-on 监听器. 实例: 父组件:<syTree :refillD ...
- const 和 readonly 修饰符的用法
1. 只有C#内置类型(int,double,long等)可以声明为const;结果.类和数组不能声明为const. 2. readonly 是在字段上使用的修饰符,直接以类名.字段访问. 3. co ...
- C#中const 和 readonly 修饰符的用法详解
1.const是不变常量,在编译的时候就需要有确定的值,只能用于数值和字符串,或者引用类型只能为null.(这里为什么要把字符串单独拿出来?是因为字符串string是引用类型,但是使用的时候却感觉是值 ...
- params修饰符的用法
params修饰符是用来声明参数数组允许向方法传递数量不定的自变量用的.事实上System.Console 类的 Write 和 WriteLine 方法是参数数组用法的典型示例.他们的声明方式如下: ...
- java中修饰符及其用法
1. java中的修饰符 a. 权限修饰符 private,默认的,protected,public b. 状态修饰符 static,final c. 抽象修饰符 abstract 2. 类修饰符 p ...
- Vue 修饰符sync的应用
官方链接 https://cn.vuejs.org/v2/guide/components-custom-events.html#sync-修饰符 这个解释有点不太直观,用代码解释一下 父组件 v-b ...
随机推荐
- Leaflet入门:添加点线面并导入GeoJSON数据|Tutorial of Leaflet: Adding Points, Lines, Polygons and Import GeoJSON File
Web GIS系列: 1.搭建简易Web GIS网站:使用GeoServer+PostgreSQL+PostGIS+OpenLayers3 2.使用GeoServer+QGIS发布WMTS服务 3.使 ...
- Short jhat tutorial: diagnosing OutOfMemoryError by example
转自: http://petermodzelewski.blogspot.com/2013/06/short-jhat-tutorial-diagnosing.html jhat这个工具经过使用, 发 ...
- [转]一次Delete&Insert引发的Mysql死锁
近日遇到一个比较奇怪的deadlock错误, 错误详情: Deadlock found when trying to get lock; try restarting transaction; nes ...
- wp8.1 app退出操作提示
微软的wp8.1 sdk相比之前wp8 sdk以及相关dll类库,微软又重新编译过,相关系统类库也经过精简,删改了部分传统dll库中的方法对象,很多常用方法对象被写进Windows.UI为前缀的命名空 ...
- 用FileZilla服务器端和客户端实现本机与虚拟机之间文件上传和下载
1. FileZilla简介 2.准备工作3.安装 FileZilla Server和配置3.1.问题及解决方法3.2.添加目录3.3.测试FIP4.安装FileZilla Client5.连接服务器 ...
- centos7 修改网卡eth0 关闭ipv6 问题总结
1. 首先关闭"NetworkManager" 服务. 然后编辑网卡的配置文件将里面的NAME DEVICE项修改为eth0 vim /etc/sysconfig/network- ...
- django数据模型中关于on_delete的使用
django数据模型中关于on_delete的使用 class BookModel(models.Model): """ 书籍表 """ b ...
- ACM-ICPC 2018青岛网络赛-H题 Traveling on the Axis
题目:略(不知道怎么从ZOJ搬题) 地址:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=4054 把这题的每个点分成两种情况 ...
- 一,Smarty模板技术/引擎——简介
Smarty是一个使用PHP写出来的模板PHP模板引擎,它提供了逻辑与外在内容的分离,简单的讲,目的就是要使PHP程序员与美工分离,使用的程序员改变程序的逻辑内容不会影响到美工的页面设计,美工重新修改 ...
- iOS开发之像素Compositing
假如Layer S·在Layer D上面,则最终的屏幕的颜色值如下: \[R = S + D \cdot (1- S_\alpha)\] \(R\): 最终的RGB \(S\): source col ...