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 ...
随机推荐
- WebService搭建
好久没有用WebService了,今天想复习一下原来的技术,结果错误百出. 这几天重装了系统,所有的东西都要重新配置,导致了很多原来没有发生过的问题,在这里做个笔记,希望以后不会再有这样的错误.
- 正则表达式(javascript)
在开发过程中要要把一个css中的平移的x,y提取出来 ,正好把正则表达式学习了一下 'fsdfsdfsdf300pxfdsfd200pxfsdfsdf100px' 找出里面 px前面的数字: 经查资 ...
- 浅谈tcp_nodelay的作用
今天在用nginx作web缓存的时候,发现在http里加入这样个参数,能有效的提高数据的实时响应性,那就是tcp_nodelay.下面我们来说说tcp_nodelay的原理: TCP_NODELAY和 ...
- Using Lucene's new QueryParser framework in Solr
Sometime back, I described how I built (among other things) a custom Solr QParser plugin to handle P ...
- wc项目记录
1.Github项目地址:https://github.com/3116004700/ruanjiangongcheng 2.预估时间见PSP表格. 3.解题思路描述: 在看到这个项目的时候我就想到了 ...
- Mathcad操作tips:函数、符号计算
函数 1. 利用“:”进行函数定义,如 2. 函数支持range variable输入,如 3. 常用数学函数可以在Insert - Function菜单中寻得. 4. 当不确定某个名字是否是函数名时 ...
- leetcode 有效的数独
判断一个 9x9 的数独是否有效.只需要根据以下规则,验证已经填入的数字是否有效即可. 数字 1-9 在每一行只能出现一次. 数字 1-9 在每一列只能出现一次. 数字 1-9 在每一个以粗实线分隔的 ...
- ZKEACMS 的两种发布方式
前言 如果你还不知道ZKEACMS,不妨先了解一下. ASP.NET MVC 开源建站系统 ZKEACMS 推荐,从此网站“拼”起来 官方地址:http://www.zkea.net/zkeacms ...
- LightOJ 1094 - Farthest Nodes in a Tree
http://lightoj.com/volume_showproblem.php?problem=1094 树的直径是指树的最长简单路. 求法: 两遍BFS :先任选一个起点BFS找到最长路的终点, ...
- Pycharm中安装Pygame并写第一个程序
第一步:打开Pycharm 第二步:点File ->Default Settings->Project Interpreter->点加号 第三步: 搜索Pygame->Inst ...