解决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 相关文章推荐
各浏览器对click方法的支持差异小结
Jul 31 Javascript
下拉菜单点击实现连接跳转功能的js代码
May 19 Javascript
jQuery实现可用于博客的动态滑动菜单
Mar 09 Javascript
js获取form的方法
May 06 Javascript
TypeError document.getElementById(...) is null错误原因
May 18 Javascript
jQuery解决IE6、7、8不能使用 JSON.stringify 函数的问题
May 31 Javascript
BootStrap实现邮件列表的分页和模态框添加邮件的功能
Oct 13 Javascript
JavaScript简单验证表单空值及邮箱格式的方法
Jan 20 Javascript
浅谈Angular路由复用策略
Oct 04 Javascript
jquery获取元素到屏幕四周可视距离的方法
Sep 05 jQuery
Vue 路由间跳转和新开窗口的方式(query、params)
Dec 25 Javascript
Postman如何实现参数化执行及断言处理
Jul 28 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
php4的session功能评述(一)
2006/10/09 PHP
PHP的FTP学习(二)
2006/10/09 PHP
PHP读取PPT文件的方法
2015/12/10 PHP
js中iframe调用父页面的方法
2014/10/30 Javascript
node.js中的fs.mkdir方法使用说明
2014/12/17 Javascript
JS获取各种宽度、高度的简单介绍
2014/12/19 Javascript
JS实现浏览器状态栏文字闪烁效果的方法
2015/10/27 Javascript
Jquery操作Ajax方法小结
2015/11/29 Javascript
详解jQuery中的deferred对象的使用(一)
2016/05/27 Javascript
JS 实现Base64编码与解码实例详解
2016/11/07 Javascript
JS实战篇之收缩菜单表单布局
2016/12/10 Javascript
微信小程序 弹幕功能简单实例
2017/02/14 Javascript
深入浅析Vue中的Prop
2018/06/10 Javascript
layui table 多行删除(id获取)的方法
2019/09/12 Javascript
微信小程序实现点击图片放大预览
2019/10/21 Javascript
iSlider手机端图片滑动切换插件使用详解
2019/12/24 Javascript
Python算法之栈(stack)的实现
2014/08/18 Python
Python标准库内置函数complex介绍
2014/11/25 Python
简介Python中用于处理字符串的center()方法
2015/05/18 Python
Python使用numpy模块创建数组操作示例
2018/06/20 Python
简单了解python 邮件模块的使用方法
2019/07/24 Python
pytorch多进程加速及代码优化方法
2019/08/19 Python
matplotlib绘制多个子图(subplot)的方法
2019/12/03 Python
python+opencv3.4.0 实现HOG+SVM行人检测的示例代码
2021/01/28 Python
matplotlib相关系统目录获取方式小结
2021/02/03 Python
YOINS官网:时尚女装网上购物
2017/03/17 全球购物
英国最大的经认证的有机超市:Planet Organic
2018/02/02 全球购物
银河香水:Galaxy Perfume
2019/03/25 全球购物
乌克兰最大的家用电器和电子产品连锁店:Eldorado
2019/10/02 全球购物
几道PHP的面试题
2012/05/19 面试题
茶叶店创业计划书范文
2014/01/19 职场文书
2014最新开业庆典策划方案(5篇)
2014/09/15 职场文书
学校后勤工作总结2015
2015/05/15 职场文书
2015小学师德工作总结
2015/07/21 职场文书
年会邀请函的格式及范文五篇
2019/11/02 职场文书
Python中json.dumps()函数的使用解析
2021/05/17 Python