组件的 name 值

最新推荐文章于 2022-09-26 10:16:00 发布
最新推荐文章于 2022-09-26 10:16:00 发布
阅读量204 收藏
点赞数
文章标签： vue javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45738653/article/details/107065317
版权

上一篇说道设置组件的 name 值的时候如果和 HTML 标签一样的话会有报错。

今天来说一说组件的 name 值的作用：

  • 当项目使用keep-alive时，可搭配组件name进行缓存过滤，可以优化性能。
  • DOM做递归组件时，递归迭代时需要调用自身 name 。在此需要保证每个 name 是项目中唯一的，否则递归会出错。        （vue组件在全局用 Vue.component() 注册时，全局ID自动作为组件的 name ）
  • vue-devtools 调试工具里显示的组件名称是由vue中组件name决定的。未命名的组件将显示成<AnonymousComponent>，但如果你定义了 name 值，可以获得更有语义的组件树
Amorleon
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue中父子组件的值传递与方法传递
10-14
以下将详细讲解Vue中父子组件的值传递和方法传递。 一、Vue中父组件向子组件传值 在Vue中，父组件向子组件传递值通常使用`props`特性。父组件通过`v-bind`指令（简写为`:`)将数据绑定到子组件的属性上。在示例代码...
vue中如何让子组件修改父组件数据
08-27
使用 .sync 可以让子组件修改父组件的值，实际上是上面的方法的精简版。 ``` // 在父组件中 // 在子组件中 <h3>{{word}} export default { props: { word: { type: String, default: '', }, }, ...
组件name的使用
weixin_47571333的博客
12-20 79
原文链接：vue-Router中name的使用 - 简书
vue组件中name的使用
qq_30436011的博客
12-02 2469
官方文档指出：name只有作为组件选项时起作用。我的理解就是在vue中，name属性是和组件息息相关的，只有在需要处理组件方面的问题才会牵扯到name属性。 常见的几种用途 1、组件递归操作 vue允许组件模板调用自身，这在日常需求中也时有出现，此时我们就可以根据组件的name，来进行操作。 例： <!-- 父组件 --> <div class="container"> <ul> <child-tree :list="comRecursive..
vue中组件的name属性含义与用法
The_Lucky_one的博客
08-24 9376
name属性：只有作为组件选项时起作用，用来**注册组件名**
vue组件的name有啥用
bluede2015的博客
10-29 672
vue组件的name有啥用1.keep-alive中，配合组件的name缓存过滤2.组件中进行递归调用自身3.vue-tools工具的展示 我们在使用组件的时候，一般都给组件一个name，这个name其实还是有用处的： 1.keep-alive中，配合组件的name缓存过滤 现在我有一个detail的组件： export default { name: 'detail' } 我们在App.vue中使用keep-alive，exclude的值就是一个组件的名称（当然这里最好还是小写的） <keep
Vue组件中name的三大作用
铁锤妹妹的博客
11-04 9935
一直不太清楚写vue项目的时候遇到给组件命名name值是干嘛用的，一直以为没啥用，直到今天接触到了与name属性相关的些东西才感觉它的用处挺多的。 作用一：递归组件 一个组件要用自己的时候，可以通过自己的名字来使用自己。 list.vue <div> <div class="item" v-for="(item, index) in list" :key="index"> <div class="item-title border-bottom">
vue跳转同一个组件,参数不同,页面接收值只接收一次的解决方法
10-16
在本文中，我们将探讨如何解决一个常见的问题，即当同一个组件被多次跳转，但每次传递的参数不同时，页面接收值只接收一次的情况。 首先，让我们回顾一下问题的场景。假设我们在`app.vue`中有以下代码片段： ```...
vue 指定组件缓存实例详解
08-27
-- 除了 name 为 a 的组件都将被缓存！ --> ``` 使用正则表达式 在使用 include 和 exclude 属性时，可以使用正则表达式来匹配组件的名称。 ```html |b/"> <component :is="view"></component> ``` 在上面的...
angular4自定义组件详解
08-29
这里的 `{{name}}` 将被替换为组件类中的 `name` 属性的值。 五、组件类 组件类是指组件的逻辑处理部分，负责处理业务逻辑和数据绑定。例如： ``` export class UserComponent { name: string; address: Address...
$refs 、$nextTic、动态组件、name的使用
idiot_MAN的博客
09-26 507
我们封装的组件，可以自己定义name属性组件名 让使用者有个统一的前缀风格。使用vue内置的keep-alive组件，可以让包裹的组件保存在内存中不被销毁。​ Vue内置的keep-alive组件，包裹要频繁切换的组件。vue内置component组件，配合is属性，设置要显示的组件。使用keep-alive内置的vue组件，让动态组件缓存。组件切换会导致组件被频繁的销毁和重新创建，性能不高。多个组件使用一个挂载点，并动态切换，就是动态组件。可以用组件的name属性值，来注册。
Vue中获取组件声明时的name属性
热门推荐
qq20004604的博客
11-16 1万+
在实际开发中，我们可能需要拿到组件声明时创建的一些属性，比较典型的话就是name属性，在实际开发中需要定位问题时，需要找到是哪一个组件，但是我们总不可能写代码的时候去先找到组件的name属性，然后复制粘贴，作为参数传给函数吧。例如：catchError('componentsName', 'errorDescription')太傻了。解决办法，获取到组件的this，然后利用this去拿到组件的nam
组件中的name属性的作用
04-27 364
1.可以作为DOM组件作为递归调用使用 例如：一个组件名为aa.vue name="aaa" 在aa.vue组件中 <aaa></aaa>就是调用aa.vue组件自己
Vue组件中name属性的作用
Whoopsina的博客
03-20 4543
查看其他人写的组件代码的时候经常会发现使用了name属性，今天来把name属性的经常使用的场景归纳一下 1.组件自身调用，递归组件 当在组件中需要调用自身的时候，可以通过name属性来使用 2.使用vue-tools工具时的组件名称 当使用调式工具时，组件的名称是通过name属性来设置的 3.移除keep-alive状态下组件自动缓存功能 我们知道，在组件外使用了keep-alive导致我们第二次进入的时候页面不会重新请求ajax，即mounted() 钩子函数只会执行一次 解决的办法一个增加activat
vue 递归组件，报错 For recursive components, make sure to provide the name option.
QQ2856639881的专栏
05-18 2140
试了很多方法，发现注册成全局组件，即可解决问题 单文件组件注册成全局的方法： 在main.js中 import Page from '../components/Page' Vue.component('v-page',Page); 这样注册全局可用，使用时就是这样：<v-page></v-page>，不需要在组件中再单独引入 ...
form表单中的name值
gyueh的博客
11-23 1236
<input type=" " name="" value=""> 一般情况下的input标签需要写name值，这样可以在输入内容时显示历史输入记录。 注意：当type类型为text时，name值不一致， 当type类型为radio时，name值必须一致， 当type类型为chenckbox时，name值可以一致也可以不一致， 当type类型为password时，name值必填 ...
子组件更新父组件的值
最新发布
08-03
子组件可以通过调用父组件传递的方法来更新父组件的值。在子组件中，可以使用`this.$emit`方法触发一个自定义事件，并将需要传递给父组件的新值作为参数传递给该方法。在父组件中，可以通过在子组件标签上使用`@`...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值