[Vue 2.7] [Vue warn]: 避免在 setup() 中使用以下划线或美元符号开头的变量,

c86crjj0  于 5个月前  发布在  其他
关注(0)|答案(6)|浏览(85)

版本

2.7.3

复现链接

codesandbox.io

复现步骤

  • 创建一个 Vue 2.7 仓库
  • 在 setup() 中使用以 $ 开头的变量,例如 $config

预期结果

以 $ 开头的变量应该设置到组件中。

实际发生的情况

  • 控制台显示警告:[Vue warn]:避免在 setup() 中使用以下划线或 $ 开头的变量。
  • 以 $ 开头的变量没有设置到组件中。

这种行为仅存在于 Vue 2.7.x,与 Vue 3 和 @vue/composition-api 不同。例如,在这个 Vue 3 的复现案例中,这是可以接受的:
https://sfc.vuejs.org/#eNp9kc9qhDAQxl9lCAVdUAM9igqll75BL7lYHbcu5g+TaA+Sd+9kd11KCz0l8+WbH/NNdvHiXLWtKGrR+IFmF8BjWF2nzKydpQA7EE4FDFa7NeAIESayGjJuypRRZrDGB3jiY5rP0CZ3nr3hslh4t7SMz9npMD08ByzPT9B2R3O19cuK7G7kbRQegouA2i19QK4AmnHeYB5bJXrnlLhqrLpu3w98jI1M87Ms2c23Rj4YohC3XKXuXXXx1nDyPZnV/cErUcNVSRqnTLUSnyE4X0vppyHt6+IrS2fJt4pWE2aNFXpdfpD98kgMVqL4wZAsbkgloRmRkP5j/rL+4SZsVCZylFfe4/33RPwG5f6dbg==

fgw7neuy

fgw7neuy1#

它们只是警告,不影响行为。

8cdiaqws

8cdiaqws2#

它们只是警告,不影响行为。参见 #12587
但是,在我展示的繁殖中,以 $ 开头的变量实际上没有设置到组件上。

lvjbypge

lvjbypge3#

当我将Nuxt 2升级到Bridge版本时,这也使用了Vue 2.7.x,这种情况就发生了。

qzwqbdag

qzwqbdag4#

我fork了上面的沙箱,并添加了两个选项API和组合API案例,它们不起作用。
https://codesandbox.io/s/romantic-aj-lx4m4s

jrcvhitl

jrcvhitl5#

当我使用async setup()时,遇到了类似的问题。基本上没有其他代码。不要在setup中使用async,没有问题;在setup中使用async,有问题。

bnlyeluc

bnlyeluc6#

isReserved 检查一个字符串是否以 $ 或 _ 开头:
vue/src/core/util/lang.ts
第12行到第15行的 bed04a7

|  | export function isReserved(str: string): boolean { |
|  | const c = (str + '').charCodeAt(0) |
|  | return c === 0x24 /* $ */ || c === 0x5f /* _ */ |
|  | } |

这个 setup() 初始化跳过了以 $ 或 _ 开头的属性:
vue/src/v3/apiSetup.ts
第62行到第66行的 bed04a7

|  | if (!isReserved(key)) { |
|  | proxyWithRefUnwrap(vm, setupResult, key) |
|  | } else if (__DEV__) { |
|  | warn(`Avoid using variables that start with _ or $ in setup().`) |
|  | } |

相关问题