其实这个就说的很好了。 sync会自动更新父组件的数据

原本valuechild 的值是222,父页面显示的222,把值传递给子组件 子组件也显示的222, 我点击子组件的按钮 把333传递给父组件,然后自动传递给子组件 造成都变成333

点击之后

都变成333了。说明子组件的值直接传递过去了

sync修饰符的简易说明的更多相关文章

  1. vue 之 .sync 修饰符

    在一些情况下,我们可能会需要对一个 prop (父子组件传递数据的属性) 进行“双向绑定”. 在vue 1.x 中的 .sync 修饰符所提供的功能.当一个子组件改变了一个带 .sync 的prop的 ...

  2. vue中.sync 修饰符

    一直以来,都不太明白.sync的用法,归根结底原因在于,没有仔细阅读“.sync修饰符”. 正好,最近在拿一个项目练手,然后使用了elment-ui,然后在用到dialog的时候,属性visible是 ...

  3. 使用sync 修饰符------子组件内部可以修改props

    首先看一个需求,外部点击一个按钮,让弹窗组件显示(也就是将弹窗组件显示的flag置为true),点击弹窗组件内部的某个按钮 ,让改props置为false,关闭弹窗,但是会报警告,因为内层组件不能修改 ...

  4. Vue sync修饰符的使用

    父子组件传值,父组件可以给子组件传值,但是子组件是不能修改组件提供的值,这里vue提供了sync修饰符,以前父组件点击子组件显示,子组件关闭按钮,父组件再点击子组件就无法让子组件显示.因为子组件点击关 ...

  5. 深入理解.sync修饰符

    原文地址:http://www.geeee.top/2019/04/17/vue-sync/ 转载请注明出处 .sync修饰符 一个组件上只能定义一个v-model,如果其他prop也要实现双向绑定的 ...

  6. 043——VUE中组件之使用.sync修饰符与computed计算属性实现购物车原理

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. [Vue]组件——.sync 修饰符实现对prop 进行“双向绑定”

    一.同时设置1个 prop 1.以 update:my-prop-name 的模式触发事件,如对于title属性: this.$emit('update:title', newTitle) 2.然后父 ...

  8. v-model和sync修饰符

    场景: 在用vue开发的过程中我们经常会遇到父子组件共用同一变量的情况,那么在这种情况下,我们肯定会想直接 把变量传过来用,因为是双向绑定的所以子组件就会修改这个变量,这样在vue中时会报错的. 问题 ...

  9. vue组件双向绑定.sync修饰符的一个坑

    我们知道组件是单项的,但是有时候需要双向,这时候我们可以使用.sync修饰符,但今天遇到一个坑,一直不成功,花了半小时试出来的.... 在编程的时候我们很习惯冒号后面跟着空格.而.sync双向绑定需要 ...

随机推荐

  1. UIScrollView _getDelegateZoomView bug 经历

    [UIScrollView _getDelegateZoomView] UIKit -[UIScrollView_offsetForCenterOfPossibleZoomView:withIncom ...

  2. 201621123049 《Java程序设计》第1周学习总结

    一. 本周学习总结 JDK,JRE,JVM等基本概念 怎么学好java???不,是怎么才能应用好??? 编程!编程!编程! 思考->设计->解决问题 二. 书面作业 1.虚拟机 1.1 执 ...

  3. RabbitMQ in Depth札记——AMQ协议

    RPC传输 作为AMQP的实现,RabbitMQ使用RPC(remote procedure call)模式进行远程会话.而不同于一般的RPC会话--客户端发出指令,服务端响应,但服务端不会向客户端发 ...

  4. POJ 3635 - Full Tank? - [最短路变形][优先队列优化Dijkstra]

    题目链接:http://poj.org/problem?id=3635 Description After going through the receipts from your car trip ...

  5. 关于初识Java整理

  6. .net WebService的使用

    1. WebService可单独作为一个网站,不限平台的被调用. 2. 打开VS,选择新建 3. [WebMethod] 方法上面有这个说明,则表示此方法可被外部调用. 我们添加4个方法:加.减.乘. ...

  7. MySQL数据类型之字符串类型

    CHAR(M) 分配固定长度的空间建(字节) VARCHAR(M)按照实际长度存储(占用的字节数是实际的长度加上1或者2)当M的值小于255时,加一.    当M的值大于255时,小于65532时,加 ...

  8. wfp(Application的运用)

    1.Application中封装了wpf的一些常用的功能,如检查未经处理的异常,处理命令行参数等. 2.如何启动wpf程序: app.xaml可用于启动wpf的窗体.也可以不用这用方式.直接创建一个a ...

  9. FW--tomcat bi-laternal https and keytool

    说明:按照本文中以下内容配置https,猫server.xml中clientAuth=false,单向验证的时候,网页中可以访问:当clientAuth=true进行双向验证的时候,网页中不可以访问: ...

  10. ios-静态库,动态库,framework浅析(一)

    一,所谓的“库”         * 所谓的“库”          库(Library)说白了就是一段编译好的二进制代码,加上头文件就可以供别人使用.什么时候我们会用到库呢?         一种情 ...