如何比通过 const 更明确地声明变量？

Question

我有一个组件 (NoteComponent) 发出 note-not-saved。此消息通过

处理

<template>
(...)
    <NoteComponent @note-not-saved='() => noteNotSaved=true' />
(...)
</template>

noteNotSaved 本身在我的 <script> 部分定义：

<script setup lang='ts'>
(...)
  const noteNotSaved = ref(false)
(...)
</script>

应用程序工作正常，但是我的 IDE（JetBrains GoLand 或 WebStorm）

发出了微弱的警告

Variable noteNotSaved implicitly declared

这到底是什么意思？ noteNotSaved 怎么能比这更明确地声明呢？

Answer 1

IDE可以将noteNotSaved=true视为全局变量的隐式声明。

尝试按如下方式更改其值：

const { createApp, ref } = Vue;

const NoteComponent = {
  template: `<button @click="$emit('note-not-saved')">Click</button>`
};

const App = {
  components: { NoteComponent },
  setup() {
    const noteNotSaved = ref(false);
    const setNoteAsNotSaved = () => {
      noteNotSaved.value = true;
    }
    return { noteNotSaved, setNoteAsNotSaved };
  }
};

createApp(App).mount("#myApp");

<script src="//unpkg.com/vue@next"></script>

<div id="myApp">
  <div><note-component @note-not-saved="setNoteAsNotSaved" /></div>
  <div><p>Note Not Saved: {{noteNotSaved}}</p></div>
</div>

如何比通过 const 更明确地声明变量？

How to more explicitly declare a variable than via const?

vue.js

webstorm

vuejs3

quasar-framework

goland