vue 调用子组件方法失败_Vue子组件调用父组件的方法及常见问题「建议收藏」

vue 调用子组件方法失败_Vue子组件调用父组件的方法及常见问题「建议收藏」1.子组件内不允许直接修改父组件传过来的参数。错误实例:子组件代码直接对data参数进行修改,则会提示错误。vue.runtime.esm.js?2b0e:619[Vuewarn]:Avoidmutatingapropdirectlysincethevaluewillbeoverwrittenwhenevertheparentcomponentre-render…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

1.子组件内不允许直接修改父组件传过来的参数。

错误实例:

子组件代码

直接对data参数进行修改,则会提示错误。

vue.runtime.esm.js?2b0e:619 [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: “data”

避免直接改变属性,因为每当父组件重新渲染时,该值都将被覆盖。相反,请使用基于属性值的数据或计算属性。道具正在变异:“数据”

2.正确方式,通过$emit实现。

方式1:在子组件内调用emit方法来更新data对象,可以配合watch使用,即子组件内值发送变化,则通知父组件数据进行更新。data为父组件通过props传入的参数对象,

this.$emit(‘update:data’,‘hello’ );

方式2:在父组件定义回调函数,

父组件向子组件内传递数据时,第一次传递失败,第二次才会正常传递。

(第一次无法将configData传递到子组件 )

原因:

父组件初始化时直接加载子组件,此时该configData对象值为空。

解决方法:

动态控制加载子组件

错误描述:

业务场景:组件之前项目引用,如A组件引用B组件,B组件引用A组件,

控制台出现 : did you register the component correctly? For recursive components, make sure to provide the “name” option.

解决方法:在main.js文件将A,B组件引入。

import isNotice from ‘@/components/home/notice’

Vue.component(‘isNotice’, isNotice)

用上面的方法全局引入组件就可以解决循环引用组件报错的问题。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/186641.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • settimeout()停止_需求方案

    settimeout()停止_需求方案转载https://aotu.io/notes/2017/09/25/manage-setTimeout-an-setInterval/在管理setTimeout&setInterval这两个APIs时,笔者通常会在顶级(全局)作用域创建一个叫 timer 的对象,在它下面有两个数组成员——{sto,siv},用它们来分别存储需要管理的setTimeoutID/…

    2022年10月3日
    0
  • Django(60)Django内置User模型源码分析及自定义User

    Django(60)Django内置User模型源码分析及自定义User前言Django为我们提供了内置的User模型,不需要我们再额外定义用户模型,建立用户体系了。它的完整的路径是在django.contrib.auth.models.User。User模型源码分析

    2022年7月31日
    4
  • Yii框架官方指南系列52——专题:性能调整

    Yii框架官方指南系列52——专题:性能调整

    2021年8月28日
    44
  • 一阶倒立摆的PID_简单旋转装置

    一阶倒立摆的PID_简单旋转装置  我做PID算法的背景和经历:本人之前电子信息科学与技术专业,对控制方向颇感兴趣,刚上大学时听到实验室老师说PID算法,那年在暑假集训准备全国电子设计竞赛,我正在练习做一个以前专科的题目,帆板角度控制系统,还不懂PID是个什么玩意,老师让我把PID加到这个题目里。当时给了一些电子版的一些教程,但是没看懂。。。。。。。后来对四旋翼很感兴趣,想弄一架玩玩再亲自写程序做一架,买了PIX飞控玩了很久,自…

    2022年8月18日
    11
  • 设计模式之策略模式_策略模式和状态模式

    设计模式之策略模式_策略模式和状态模式概述在策略模式(StrategyPattern)中,一个类的行为或其算法可以在运行时更改。这种类型的设计模式属于行为型模式。在策略模式中,我们创建表示各种策略的对象和一个行为随着策略对象改变而改

    2022年8月16日
    13
  • WritePrivateProfileString函数说明[通俗易懂]

    WritePrivateProfileString函数说明[通俗易懂]在我们写的程序当中,总有一些配置信息需要保存下来,以便完成程序的功能,最简单的办法就是将这些信息写入INI文件中,程序初始化时再读入.具体应用如下:   一.将信息写入.INI文件中.   .所用的WINAPI函数原型为: BOOLWritePrivateProfileString(   LPCTSTRlpAppName,   LPCTSTRlpKeyN

    2022年7月14日
    23

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号