Vue.js 个组件中的随机 "data-v-*" 属性
random "data-v-*" attribute in Vue.js components
试验 Vue.js the first thing I noticed is how every instance of a component that I define as single file component 并作为自定义元素包括在内,获取随机哈希属性,如 data-v-58fd7087=""
。
具体来说:
- 给定组件的每个实例的每个 DOM 元素都获得相同的哈希值
- 散列独立于路由器生成
- 哈希在调用之间是稳定的
- 散列在组件名称更改之间是稳定的
- 哈希未存储/生成在磁盘上
- 因此哈希是动态生成的
它可以由我的 Vue 设置中的 Karma or Webpack 生成吗?
如果不是,这些对我来说是一些令人惊讶的观察结果。它导致两个问题:
- 何时以及如何生成此哈希(属性)?
- 为什么会生成散列(属性)?
将 scoped CSS 与 Vue Loader 一起使用时会发生类似的情况。
我使用范围 css 并且我有像 data-v-4646bc3c
这样的属性,所以我认为就是这样。
如果您不需要此功能,请尝试从您的单个文件组件中删除 scoped
属性。
<style scoped>
/* local styles */
</style>
如果你正在使用 vueify
并且你想知道为什么你在没有更改任何内容的情况下在你的构建中进行更改,请确保你 运行 vueify 与 process.env.NODE_ENV
设置为 'production'
。否则它会生成热重载代码,在每个构建中都有新的 data-v-*
哈希值。
试验 Vue.js the first thing I noticed is how every instance of a component that I define as single file component 并作为自定义元素包括在内,获取随机哈希属性,如 data-v-58fd7087=""
。
具体来说:
- 给定组件的每个实例的每个 DOM 元素都获得相同的哈希值
- 散列独立于路由器生成
- 哈希在调用之间是稳定的
- 散列在组件名称更改之间是稳定的
- 哈希未存储/生成在磁盘上
- 因此哈希是动态生成的
它可以由我的 Vue 设置中的 Karma or Webpack 生成吗? 如果不是,这些对我来说是一些令人惊讶的观察结果。它导致两个问题:
- 何时以及如何生成此哈希(属性)?
- 为什么会生成散列(属性)?
将 scoped CSS 与 Vue Loader 一起使用时会发生类似的情况。
我使用范围 css 并且我有像 data-v-4646bc3c
这样的属性,所以我认为就是这样。
如果您不需要此功能,请尝试从您的单个文件组件中删除 scoped
属性。
<style scoped>
/* local styles */
</style>
如果你正在使用 vueify
并且你想知道为什么你在没有更改任何内容的情况下在你的构建中进行更改,请确保你 运行 vueify 与 process.env.NODE_ENV
设置为 'production'
。否则它会生成热重载代码,在每个构建中都有新的 data-v-*
哈希值。