其实就是一个原因,实例化出来的根组件只有一个,你可以将它写成对象,或者是返回一个对象的函数。但是子组件不够健壮,容易在内存的地址中互相影响,就像我们常用的深浅拷贝所能解决的那样。所以为了防止意外的发生,是不被允许在子组件中使用对象来写data。

效果如下

单利模式：

效果：

vue 子组件data属性为啥必须是一个函数的更多相关文章

  1. vue父组件如何调用子组件的属性或方法

    常常我们需要组件的拆分,就涉及到父子调用的关系,那么父组件如何调用子组件的属性和方法呢? 子组件child <template> <div> {{msg}} </div& ...

  2. 14. VUE 子组件修改父组件的值

    在 Vue 当中,父组件 -> 子组件 传值,都是通过属性的形式传递的. 子组件 修改 传递数据 直接操作父组件传递过来的值,用是可以用的,但是打开控制台后,会发现 Vue 有个警告:你不要直接 ...

  3. Vue 子组件向父组件传参

    直接上代码 <body> <div id="counter-event-example"> <p>{{ total }}</p> & ...

  4. Vue 子组件调用父组件 $emit

    <!DOCTYPE html><html>    <head>        <meta charset="utf-8">      ...

  5. vue子组件通知父组件使用方法

    vue子组件通知父组件使用方法 <template> <mt-field placeholder="验证码" v-model="getverifycod ...

  6. vue子组件修改父组件传递过来的值

    这里不再赘述父子组件及子父组件传值,不懂的同学可以翻看我以前写过的关于两者传值的文章 父子组件传值:https://www.cnblogs.com/Sky-Ice/p/9267192.html 子父组 ...

  7. Vue子组件传递数据给父组件

    子组件通过this.$emit(event,data)传递数据到父组件 以下是例子: father.vue 父组件 <template> <div> <child @ne ...

  8. Vue子组件调用父组件的方法

    Vue子组件调用父组件的方法   Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...

  9. vue子组件的样式没有加scoped属性会影响父组件的样式

    scoped是一个vue的指令,用来控制组件的样式生效区域,加上scoped,样式只在当前组件内生效,不加scoped,这个节点下的样式会全局生效. 需要注意的是:一个组件的样式肯定是用来美化自己组件 ...

  10. vue子组件为父组件属性写值

    父组件调用子组件代码(关键字sync): <importModel :visible.sync="dialogModelVisible"></importMode ...

随机推荐

  1. Go context 介绍

    在 Go 编程语言中,context 包提供了一个用于在 goroutine 之间传递上下文信息的方法.它通常用于控制 goroutine 的生命周期.传递请求范围内的数据.以及处理超时或取消信号.c ...

  2. LaTeX 编译 acmart 文档报错：No country present for an affiliation.

    在编译一篇从 arXiv 下载的文档时遇到如下错误: Class acmart Error: No country present for an affiliation. 有两种解决方案: 将错误降级 ...

  3. 【Jenkins】Mac系统之忘记jenkins密码，如何修改密码

    参考文章<jenkins管理员密码登录不了> 一.修改config.xml文件 Mac下的文件在 /Users/xxx/.jenkins/users/登录的用户名/config.xml 复 ...

  4. windows 终端美化

    效果图: 1. 安装 windows terminal 打开 windows 自带的应用商店,安装 windows terminal 1.1 设置 windows terminal 注意:以下设置完成 ...

  5. ES6中的Set数据结构

    Set是ES6新推出的数据结构,Set结构里面的每个元素都是唯一的: 如何创建一个Set? // Set 构造函数接收一个数组进行初始化;如果什么都不传则创建一个空Set; var set = new ...

  6. JavaScript – Rest Parameters & Spread Operator

    介绍 Rest 和 Spread 的共同点是语法都是 ... (点点点). 但它们的概念是相反的. 看例子体会: Rest Parameters 参考: 阮一峰 – rest 参数 rest para ...

  7. Angular 学习笔记 language service

    尝试 v10 rc 的时候, 突然 language service 不 work 了. ctrl + shift + p -> Show logs... 这样可以检查和 report issu ...

  8. vscode单行注释失效解决办法

    第一种情况: bug:在使用快捷键注释的时候,只有style和script标签里的内容注释有问题,无法使用快捷键注释. 解决方法:禁用vscode的插件Jinja. 第二种情况 方法一 1.Ctrl+ ...

  9. Vue 文件流预览 PDF

    Vue js // pdf 预览 export function download(id) { return request({ url: '/bbs/regtech/law/download?id= ...

  10. package.json文件干什么的 ？

    package.json 是项目描述文件,记录了当前项目的信息,比如项目的名字,版本,作者,还有所依赖的第三方模块 : dependencies 是项目依赖,是项目上线时要依赖的第三方包 : devd ...