陈尼克你好的代码

<template>
  <test :count="count" @add="add"></test>
  
</template>

<script>
import { ref, isRef } from "vue";
import Test from "./components/Test.vue";
  export default {
    name: "#App",
    //disc:你好,
      },
    setup() {
      
      name: "陈尼克",
      disc: "你好"

    }



      return {
        name,
        disc,
      };
      console.log(count)
    },
  };

  
  </script>
  <style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>


再错

<template>
  {{ text }}
  
</template>

<script>
import { ref, isRef, computed } from "vue";
import Test from "./components/Test.vue";
  export default {
    name: "App",
      }
    setup() {
      const App = reactive({  //为什么这里App是state
      name: "陈尼克",
      desc: "你好",
      });
    
    const text = computed(() => {
      console.log("11");
      return state.name +state.desc;
    });

    setTimeout(() => {
      name: {
        李尼克
      },2000),
      
    })

      return {
        text,
      };
    },
    };
   
  
  </script>
  <style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>


正确的代码

<template>
  {{ text }}
  
</template>

<script>
import { reactive, computed } from "vue";
  export default {
    name: "App",
      
    setup() {
      const state = reactive({  //为什么这里App是state
      name: "陈尼克",
      desc: "你好",
      });
    
    const text = computed(() => {
      console.log("11");
      return state.name +state.desc;
    });

    setTimeout(() => {
      state.name = 李尼克;
      },2000);
      

      return {
        text,
      };
    },
  };
   
  
  </script>
  <style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>


怎么没有改成李尼克你好呢?

<template>
  {{ text }}
</template>

<script>
import { reactive, computed } from "vue";
  export default {
    name: "App",
    setup() {
      const state = reactive({  //为什么这里App是state
      name: "陈尼克",
      desc: "你好",
      });
    
    const text = computed(() => {
      console.log("11");
      return state.name + state.desc;
    });

    setTimeout(() => {
      state.name = 李尼克;
      },1000);
      
      return {
        text,
      };
    },
  };
   
  
  </script>
  <style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>


忘记打引号了

<template>
  <p>{{ text }}</p>
</template>

<script>
import { reactive, computed } from "vue";
  export default {
    name: "App",
    setup() {
      const state = reactive({  //为什么这里App是state
      name: "陈尼克",
      desc: "你好",
      });
    
    const text = computed(() => {
      console.log("11");
      return state.name + state.desc;
    });

    setTimeout(() => {
      state.name = "李尼克";
      },2000);
      
      return {
        text,
      };
    },
  };
   
  </script>
  <style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>


再加一个
这里的state是一个内置的,还是自己写的变量

<template>
  <p>{{ text }}</p>
</template>

<script>
import { reactive, computed } from "vue";
  export default {
    name: "App",
    setup() {
      const state = reactive({  //为什么这里App是state
      name: "陈尼克",
      desc: "你好",
      });
    
    const text = computed(() => {
      console.log("11");
      return state.name + state.desc;
    });

    setTimeout(() => {
      state.name = "李尼克";
      state.desc = "你好吗";
      },2000);
      
      return {
        text,
      };
    },
  };
   
  </script>
  <style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值