解决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 相关文章推荐
JQuery 1.6发布 性能提升,同时包含大量破坏性变更
May 10 Javascript
点击button获取text内容并改变样式的js实现
Sep 09 Javascript
JS 获取鼠标左右键的键值方法
Oct 11 Javascript
jQuery中document与window以及load与ready 区别详解
Dec 29 Javascript
Javascript核心读书有感之语言核心
Feb 01 Javascript
jquery实现弹出层登录和全屏层注册特效
Aug 28 Javascript
RequireJS入门一之实现第一个例子
Sep 30 Javascript
JavaScript操作HTML DOM节点的基础教程
Mar 11 Javascript
深入浅析knockout源码分析之订阅
Jul 12 Javascript
JS 调用微信扫一扫功能
Dec 22 Javascript
vue指令之表单控件绑定v-model v-model与v-bind结合使用
Apr 17 Javascript
vue el-table实现自定义表头
Dec 11 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的array_multisort()使用方法介绍
2012/05/16 PHP
php关键字仅替换一次的实现函数
2015/10/29 PHP
PHP中功能强大却很少使用的函数实例小结
2016/11/10 PHP
PHP中Notice错误常见解决方法
2017/04/28 PHP
PHP+Ajax实现的检测用户名功能简单示例
2019/02/12 PHP
laravel 数据迁移与 Eloquent ORM的实现方法
2019/04/12 PHP
onkeypress字符按键兼容所有浏览器使用介绍
2013/04/24 Javascript
JavaScript引用类型和基本类型详解
2016/01/06 Javascript
javascript嵌套函数和在函数内调用外部函数的区别分析
2016/01/31 Javascript
前端js实现文件的断点续传 后端PHP文件接收
2016/10/14 Javascript
JS中showModalDialog关闭子窗口刷新主窗口用法详解
2017/03/25 Javascript
详解jQuery中的isPlainObject()使用方法
2018/02/27 jQuery
layui table设置前台过滤转义等方法
2018/08/17 Javascript
解决vue+element 键盘回车事件导致页面刷新的问题
2018/08/25 Javascript
extjs图表绘制之条形图实现方法分析
2020/03/06 Javascript
使用Vant完成DatetimePicker 日期的选择器操作
2020/11/12 Javascript
[56:47]Ti4 循环赛第三日 iG vs Liquid
2014/07/12 DOTA
[49:58]完美世界DOTA2联赛PWL S3 Magma vs DLG 第一场 12.18
2020/12/19 DOTA
让python的Cookie.py模块支持冒号做key的方法
2010/12/28 Python
Python中的sort()方法使用基础教程
2017/01/08 Python
Python 字典与字符串的互转实例
2017/01/13 Python
Python 错误和异常代码详解
2018/01/29 Python
如何实现Django Rest framework版本控制
2019/07/25 Python
浅谈Python 递归算法指归
2019/08/22 Python
Django连接数据库并实现读写分离过程解析
2019/11/13 Python
Python多进程multiprocessing、进程池用法实例分析
2020/03/24 Python
世界上最大的汽车共享网站:Zipcar
2017/01/14 全球购物
C++面试题:关于链表和指针
2013/06/05 面试题
介绍一下#error预处理
2015/09/25 面试题
自我评价如何写好?
2014/01/05 职场文书
协议书范本
2014/04/23 职场文书
社会体育专业大学生职业生涯规划书
2014/09/17 职场文书
2014年教学工作总结
2014/11/13 职场文书
承诺书的内容有哪些,怎么写?
2019/06/21 职场文书
蔬果开业典礼发言稿应该怎么写?
2019/09/03 职场文书
win sever 2022如何占用操作主机角色
2022/06/25 Servers