name有什么作用

export default {
  name: 'StaticPart',
  setup () {
    const iconsList = [
      { imgName: '超市', desc: '超市便利' },
      { imgName: '菜市场', desc: '菜市场' },
      { imgName: '水果店', desc: '水果店' },
      { imgName: '鲜花', desc: '鲜花绿植' },
      { imgName: '医药健康', desc: '医药健康' },
      { imgName: '家居', desc: '家居时尚' },
      { imgName: '蛋糕', desc: '烘培蛋糕' },
      { imgName: '签到', desc: '签到' },
      { imgName: '大牌免运', desc: '大牌免运' },
      { imgName: '红包', desc: '红包套餐' }
    ]

    return { iconsList }
  }
}

老师，如上代码name属性代表什么意思，有什么作用吗？好像写和不写都不会影响整体代码。写了有什么用处呢？

慕勒8540250 2023-12-02

源自：项目：仿京东到家首页开发 2-7 使用v-for, v-html 指令精简页面代码

收起

1回答

慕勒8540250 提问者 2023-12-03 13:18:58

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  }, {
    path: '/login',
    name: 'Login',
    component: Login
  }
]

老师，还有在router里面的routes里的name有什么作用吗？写和不写都有区别吗？写name名字的时候有没有什么规范，一定要和文件名一样吗还是说随便起名都可以？

收起回答

好帮手慕久久 #1

同学你好，解答如下：
1、组件的name属性用来设置组件的名字，它是有一定作用的，在实现某些功能的时候，需要借助name属性。比如：页面中需要使用递归组件（组件自身调用，递归组件）、页面中使用keep-alive设置组件缓存等功能。当这些特殊、高级功能被使用的时候，就需要name属性。而一些基础功能，不会用到name属性，此时不写name也不会对页面功能造成影响。
2、routes中的name也一样，当需要做路由跳转等功能时，可能需要借助name属性才能实现。如果不使用这些功能，则不写name也没什么影响。
3、从规范上讲，不管用不用那些特殊功能，都建议将name属性写上，保持代码的完整。
name属性的值，可以不与文件名相同；但是name与文件名同名，是约定俗成的规则，大家都这么做，所以建议遵守。
name起名的时候，需要遵守当前版本的eslint语法检测插件的规则。有些版本的eslint对组件的名字有要求，比如不能使用大写字母开头等等。同学可以先正常起名，如果出错，命令行中会有提示信息，再对应修改就行。
祝学习愉快！

2023-12-04 09:30:21