Vue3でdefined but never used no-unused-varsのエラーが出る

Question

<template>
  <div class="alert alert-primary">
    <h1>{{title}}</h1>
    <p>{{data.msg}} ({{data.count}})</p>
  </div>
</template>

<script>
import { ref } from 'vue'

export default {
  props: {
    title: String
  },
  setup(props) {
    const data = ref({
      msg: 'This is ref-value!',
      count: 0
    })
    setInterval(()=>{
      data.value.count++
    }, 1000)
    return {
      data
    }
  }
}
</script>

Failed to compile.

./src/components/HelloWorld.vue
Module Error (from ./node_modules/eslint-loader/index.js):

/Users//Desktop/vue_projects/vue3-learning-tests/src/components/HelloWorld.vue
  15:9  error  'props' is defined but never used  no-unused-vars

✖ 1 problem (1 error, 0 warnings)

バージョンは
npm -v→6.14.6
npm list vue→vue@3.2.14
node -v→v12.18.4
です。

本をもとにコードを書いており、スペルミスもないのですが、コンパイルエラーが出てしまっています。
propsも定義しているので？？？となっております。

Answer 1

  setup(props) {

上記の props が使われていないので、
'props' is defined but never used (定義されてるけど使われてない)

なので削除します。

  setup() {

または変数名を _ で始めても回避できるかもしれません。

  setup(_props) {

Comments

[laravel12345]

お助けいただきましてありがとうございます！
setup() {
で解決できました。

なお、setup(_props) {
も試しましたが、'_props' is defined but never usedのエラーが出ました。

[neko_daisuki]

setup(props, contenxt) と書いたときに、context のみ使う場合(でも props も書かないといけない)、
setup(_props, contenxt) とすると通るのですが、不必要なものは削らないと怒られるみたいですね。

[laravel12345]

Vueの勉強始めたばかりだったので、大変助かりました。自分でもドキュメントなどもう少ししっかりと読んでみます。