解决vue 子组件修改父组件传来的props值报错问题


Posted in Javascript onNovember 09, 2019

vue不推荐直接在子组件中修改父组件传来的props的值,会报错

[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "result" (found in component )

<input v-model="currentSearch" type="text" class="input-search" @keydown.enter="doSearch">
export default {
  name:"round-search-bar",
  props:['search'],  //父组件传来的值
  data(){
    return {
      currentSearch: this.search  //通过data, 定义新变量currentSearch, 这样currentSearch的值变更时,不会影响父组件传来的search的值
    }
  },
  methods: {
    doSearch(){
      Util.searchAPI(this.$router,this.currentSearch)
    }
  },
}

以上这篇解决vue 子组件修改父组件传来的props值报错问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
写了一个layout,拖动条连贯,内容区可为iframe
Aug 19 Javascript
JavaScript高级程序设计 学习笔记 js高级技巧
Sep 20 Javascript
当鼠标移动时出现特效的JQuery代码
Nov 08 Javascript
sliderToggle在写jquery的计时器setTimeouter中不生效
May 26 Javascript
javascript css红色经典选项卡效果实现代码
May 17 Javascript
JQuery 设置checkbox值二次无效的解决方法
Jul 22 Javascript
Angular和百度地图的结合实例代码
Oct 19 Javascript
详解Node.js access_token的获取、存储及更新
Jun 20 Javascript
Angular中的$watch、$watchGroup、$watchCollection
Jun 25 Javascript
angular学习之从零搭建一个angular4.0项目
Jul 10 Javascript
JS实现自定义弹窗功能
Aug 08 Javascript
CountUp.js数字滚动插件使用方法详解
Oct 17 Javascript
解决vue组件中click事件失效的问题
Nov 09 #Javascript
浅谈vue中组件绑定事件时是否加.native
Nov 09 #Javascript
Vue根据条件添加click事件的方式
Nov 09 #Javascript
浅谈vuex中store的命名空间
Nov 08 #Javascript
解决$store.getters调用不执行的问题
Nov 08 #Javascript
在Vue中使用this.$store或者是$route一直报错的解决
Nov 08 #Javascript
vue.js的状态管理vuex中store的使用详解
Nov 08 #Javascript
You might like
php多个字符串替换成同一个的解决方法
2013/06/18 PHP
支持png透明图片的php生成缩略图类分享
2015/02/08 PHP
PHP面向对象程序设计之对象生成方法详解
2016/12/02 PHP
PHP文字转图片功能原理与实现方法分析
2017/08/31 PHP
yii框架结合charjs统计上一年与当前年数据的方法示例
2020/04/04 PHP
jBox 2.3基于jquery的最新多功能对话框插件 常见使用问题解答
2011/11/10 Javascript
jQuery循环滚动展示代码 可应用到文字和图片上
2012/05/11 Javascript
js怎么终止程序return不行换jfslk
2013/05/30 Javascript
JS和函数式语言的三特性
2014/03/05 Javascript
php中给js数组赋值方法
2014/03/10 Javascript
jQuery标签替换函数replaceWith()的使用例子
2014/08/28 Javascript
微信小程序 教程之条件渲染
2016/10/18 Javascript
理解JavaScript原型链
2016/10/25 Javascript
动态创建Angular组件实现popup弹窗功能
2017/09/15 Javascript
vue axios 表单提交上传图片的实例
2018/03/16 Javascript
微信小程序实现联动选择器
2019/02/15 Javascript
PHPStorm中如何对nodejs项目进行单元测试详解
2019/02/28 NodeJs
vue无限轮播插件代码实例
2019/05/10 Javascript
Vue.js下拉菜单组件使用方法详解
2019/10/19 Javascript
Vue实现base64编码图片间的切换功能
2019/12/04 Javascript
基于python yield机制的异步操作同步化编程模型
2016/03/18 Python
Flask框架信号用法实例分析
2018/07/24 Python
python多进程控制学习小结
2018/10/31 Python
如何用C代码给Python写扩展库(Cython)
2019/05/17 Python
Python爬虫爬取煎蛋网图片代码实例
2019/12/16 Python
Pytorch .pth权重文件的使用解析
2020/02/14 Python
基于Keras 循环训练模型跑数据时内存泄漏的解决方式
2020/06/11 Python
详解Python 中的容器 collections
2020/08/17 Python
利用css3 translate完美实现表头固定效果
2017/02/28 HTML / CSS
电大学习个人自我评价范文
2013/10/04 职场文书
创业计划书六个要素
2013/12/26 职场文书
校庆接待方案
2014/03/18 职场文书
群众路线领导班子四风对照检查材料
2014/09/27 职场文书
开展警示教育活动总结
2015/05/09 职场文书
MySQL EXPLAIN输出列的详细解释
2021/05/12 MySQL
Mysql关于数据库是否应该使用外键约束详解说明
2021/10/24 MySQL