vscode配置代码片段

1.ctrl + shift + p 然后选择 Snippets:Configure User Snippets (配置用户代码片段)

2.选择vue或者vue.json

3.下面为json内容

{

"vue-template": {

"prefix": "modal-table",

"body": [

"",

" <a-modal v-model:visible="visible" width="1000px" title="" :maskClosable="false" @ok="onOk">",

" <a-table bordered :columns="columns" :pagination="false" :data-source="list"> ",

" ",

"",

"",

"<script setup lang="tsx">",

"import { message } from 'ant-design-vue'",

"import request from '@/utils/request'",

"const emit = defineEmits(['sure'])",

"const visible = ref(false)",

"const list: any = ref([])",

"const columns = [",

" {",

" title: '',",

" dataIndex: 'name',",

" align: 'center',",

" customRender: ({ record }: { record: any }) => {",

" return (",

" // prettier-ignore",

"
",
" )",
" }",
" },",
" {",
" title: '',",
" dataIndex: 'age',",
" align: 'center'",
" }",
"]",
"function onOk() {",
" emit('sure')",
" visible.value = false",
"}",
"function showModal() {",
" visible.value = true",
"}",
"defineExpose({ showModal })",
""
],
"description": "vue-template"
},
"vue-template": {
"prefix": "modal",
"body": [
"",
" <a-modal v-model:visible="visible" width="1000px" title="" :maskClosable="false" @ok="onOk">",
"",
" ",
"",
"",
"<script setup lang="tsx">",
"import { message } from 'ant-design-vue'",
"import request from '@/utils/request'",
"const emit = defineEmits(['sure'])",
"const visible = ref(false)",
"function onOk() {",
" emit('sure')",
" visible.value = false",
"}",
"function showModal() {",
" visible.value = true",
"}",
"defineExpose({ showModal })",
""
],
"description": "vue-template"
},
}

相关推荐
2501_9387918320 分钟前
服务器上的 VsCode:Github Copilot 显示 “连接失败”?网络与权限排查
服务器·vscode·github
Molesidy25 分钟前
【Embedded System】【CMake】Windows下CMake+VSCode的开发环境搭建以及初步认识
ide·vscode·编辑器·cmake
一道雷2 小时前
🚀 Vue Router 插件系统:让路由扩展变得简单优雅
前端·javascript·vue.js
不如摸鱼去3 小时前
从 Wot UI 出发谈 VSCode 插件的自动化发布
前端·vscode·开源·自动化
半桶水专家4 小时前
Vue 3 插槽(Slot)详解
前端·javascript·vue.js
oioihoii5 小时前
在VSCode中配置Rust开发环境的详尽指南
ide·vscode·rust
李少兄5 小时前
如何将 TRAE IDE 的插件市场源切换至 VS Code 官方市场
ide
梵得儿SHI6 小时前
Vue 数据绑定深入浅出:从 v-bind 到 v-model 的实战指南
前端·javascript·vue.js·双向绑定·vue 数据绑定机制·单向绑定·v-bind v-model
路由侠内网穿透.8 小时前
本地部署集成全能平台 Team.IDE 并实现外部访问
运维·服务器·数据库·ide·远程工作
十里-16 小时前
在 Vue2 中为 Element-UI 的 el-dialog 添加拖拽功能
前端·vue.js·ui