vue代码片段

{
    "create-vue": {
        "scope": "",
        "prefix": "vue",
        "body": [
            "<template>",
            "\t<div class='$1'></div>",
            "</template>",
            "",
            "<script>",
            "export default {",
            "\tname: '$1',",
            "\tprops: {",
            "\t\treturn {}",
            "\t},",
            "\tsetup() {},",
            "}",
            "</script>",
            "",
            "<style scoped lang=scss>",
            "/* ~@/styles/variables.scss; 引入css类 */",
            ".$1{}",
            "</style>"
        ],
        "description": "Log output to console"
    },
    "create-vue-dialog": {
        "scope": "",
        "prefix": "vued",
        "body": [
            "<template>",
            "\t<el-dialog class='$1' title='' :visible.sync='isOpen' :append-to-body='true' :before-close='onCloseDialog' :close-on-click-modal='false'>",
            "\t\t<div class='form-main'>",
            "\t\t\t<el-form :key='isLoad' :model='form' :rules='rules' ref='refForm' label-width='120px'>",
            "\t\t\t</el-form>",
            "\t\t</div>",
            "\t\t<div slot='footer'>",
            "\t\t\t<div class='footer-btn'>",
            "\t\t\t\t<el-button @click='onCancle'>取消</el-button>",
            "\t\t\t\t<el-button type='primary' @click='onSubmit'>提交</el-button>",
            "\t\t\t</div>",
            "\t\t</div>",
            "\t</el-dialog>",
            "</template>",
            "",
            "<script>",
            "export default {",
            "\tname: '$1',",
            "\tprops: {",
            "\t\tisOpen: {type: Boolean, default: false}",
            "\t},",
            "\tsetup(props, { root, emit }) {",
            "\t\t// data",
            "const refForm = ref(null)",
            "const state = reactive({form: {}, isLoad: false})",
            "",
            "\t\t// 属性",
            "\t\tonMounted(() => {",
            "\t\t\t// 防止 - 初次提交refs 为null",
            "\t\t\tstate.isLoad = false;",
            "\t\t\tnextTick(() => {",
            "\t\t\t\tstate.isLoad = true;",
            "\t\t\t});",
            "\t\t});",
            "",
            "\t\t// 方法",
            "\t\tconst onSubmit = () => { refForm.value.validate(async valid => {if (valid) {} else {}}); };",
            "\t\tconst onCloseDialog = () => { emit('closeDialog') }",
            "\t\tconst onCancle = () => { onCloseDialog(); };",
            "",
            "\t\t// 返回",
            "\t\treturn { isLoad, onSubmit, onCancle, onCloseDialog }",
            "\t},",
            "}",
            "</script>",
            "",
            "<style scoped lang=scss>",
            "/* ~@/styles/variables.scss; 引入css类 */",
            ".$1{}",
            "</style>"
        ],
        "description": "Log output to console"
    }
}