练习vue3，import 进来的shallLow组件不显示

Question

app.vue文件

<template>

  <div class="head">

    <shall-low></shall-low>

  </div>

</template>

<script>

import shallLow from './view/shanllow'

export default{

name: "App",

  components:{shallLow},

}

</script>

shanllow文件

<template>

  <div>

    <span @click="state">点击了吗</span>

  </div>

</template>
<script>
import { shallowReactive } from "vue";
export default {
  name:"shanllow",
  setup() {
    const obj = shallowReactive({a:1,b:{c:2}});
    function state(){
      console.log(obj);
    }
    return(obj,state);
  },
  data() {
    return {};
  },
};
</script>

练习vue3，import 进来的shallLow组件不显示，只有当改变shallLow组件里的界面内容才会显示，一旦刷新界面就又不显示了

Answer 1

setup方法返回的是一个对象，应该写为：

setup() {
    const obj = shallowReactive({a:1,b:{c:2}});
    function state(){
      console.log(obj);
    }
    return{
       obj,
       state
    }
  },