Vue3 模板代码片段 可直接复制

{
  "Print to console": {
    "prefix": "vue3",
    "body": [
      "<template>",
              "<div>",
        "<!-- 定义子组件 -->",
              "</div>",
            "</template>",
            "<script>",
             "// 解构",
            "import { defineComponent",
                  "} from 'vue'",
            "// 模块化",
            "export default defineComponent({",
               "name:'Home', //组件名称",
               "props: {",
            "// 接收父组件数据",
                  "},",
               "components: {",
            "// 定义子组件",
                    "},",
            "setup(props, ctx){",
            "// 这里没有this,直接使用props里数据",
              "return {}",
                  "}",
                "})",
            "</script>",
            "<style scoped>",
      "/* scoped 使用得定义的样式只在本页面内生效  */",
            "</style>",
      " "
      ],
      "description": "A vue file template"
  }
}

{
  "vue3 template": {
    "prefix": "vue3",
    "body": [
      "<template>",
      "    <div>",
      "$1",
      "    </div>",
      "</template>\n",
      "<script setup>",
      "import { ref } from \"vue\" ",
      "$2",
      "</script>\n",
      "<style lang=\"less\" scoped>",
      "$3",
      "</style>"
    ],
    "description": "vue3 template"
  }
}