导入后Vue内容/代码未显示

hiz5n14c  于 2023-08-07  发布在  Vue.js
关注(0)|答案(1)|浏览(164)

路径是正确的,只是在App. vue中没有显示任何代码。我是vue的新手,所以我不知道现在出了什么问题,任何帮助都是惊人的!
App.vue

<script setup>
import test from './components/test.vue'
</script>

<template>
      
</template>

字符串
test.vue

<template>
  <div>
    <h1>{{ message }}</h1>
    <button @click="changeMessage">Change Message</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: "Hello, Vue!"
    };
  },
  methods: {
    changeMessage() {
      this.message = "Message changed!";
    }
  }
};
</script>

<style scoped>
h1 {
  color: blue;
}
</style>

6kkfgxo0

6kkfgxo01#

Vue3 SFC Playground
你应该把你的组件放到模板中:

<script setup>
import test from './components/test.vue'
</script>

<template>
   <test />   
</template>

字符串

相关问题