以下是针对代码的优化建议:

  1. 将 'v-show' 属性改为 'v-if' 属性,这样可以避免不必要的 DOM 渲染。

  2. 将 style 样式移动到 CSS 文件中,避免在 HTML 中直接添加样式。

  3. 将 div 标签改为 template 标签,避免在渲染时产生多余的 div 元素。

  4. 将 'v-loading' 属性改为 'v-wait' 属性,这是 Vue3 中的新指令。

改进后的代码如下:

<template>
  <strong class="ff-ab">
    <template v-if="resdata.status">
      <div v-wait style="margin-top: -30px"></div>
    </template>
    <template v-else>
      {{ resdata.shijian }}
    </template>
  </strong>
</template>

<script>
export default {
  props: {
    resdata: Object,
  },
};
</script>

<style scoped>
.ff-ab {
  /* 添加样式 */
}
</style>
Vue3 代码优化技巧:提升性能和可读性

原文地址: https://www.cveoy.top/t/topic/lB9R 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录