vetur预制一个弹窗代码块

435 阅读1分钟

vetur

<template>
  <a-modal
    @ok="${2}"
    :maskClosable="false"
    title="${0}"
    :visible="${1}"
    :width="550"
    @cancel="close"
  >
  </a-modal>
</template>

<script>
export default {
  props:{
    ${1}: {
      type: Boolean,
      required: true
    }
  },
  data() {
    return {
      loading: false
    }
  },
  methods: {
    // action
    ${2}() {},
    
    // modal
    close() {
      this.\$emit('update:${1}', false)
    },
    update() {
      this.\$emit('update')
    }
  }
}
</script>

<style lang="scss" scoped></style>

将弹窗分离成组件时,需要用到的vscode代码块

使用方法

新建一个vue文件,复制代码进去,然后放到vscode vetur插件安装目录的指定文件夹里,再在vscode输入命令行reload window。具体方法查看上一篇文章【Vue 技巧】自定义Vetur快捷代码块snippet

image.png