本文已参与「新人创作礼」活动,一起开启掘金创作之路
"WpAntdVueMentionsSnippet": {
"prefix": "w-mentions",
"body": [
"<a-mentions",
" v-model=\"value\"",
" split=\" \"",
" :prefix=\"prefixs\"",
" @change=\"onChange\"",
" @select=\"onSelect\"",
" @search=\"onSearch\"",
" >",
" <a-mentions-option v-for=\"(item, index) in prefixOptions[prefix] || []\" :key=\"index\" :value=\"item\">{{",
" item",
" }}</a-mentions-option></a-mentions",
" >",
" <!-- data () {",
" return {",
" value: '',",
" prefixs: ['@', '#'],",
" prefix: '@',",
" prefixOptions: { '@': ['126.com', '163.com', 'qq.com'], '#': ['1.0', '1.2'] }",
" }",
" },",
" methods: {",
" onChange (value) {},",
" onSelect (option) {},",
" onSearch (val, prefix) {",
" this.prefix = prefix",
" }",
" }, -->",
],
"description": "AntdVue提及代码片段"
},
"WpAntdVueRadioGroupSnippet": {
"prefix": "w-radio-group",
"body": [
"<a-radio-group v-model=\"value\" @change=\"onChange\" :options=\"options\"></a-radio-group>",
" <!-- data () {",
" return {",
" value: '',",
" options: [",
" {",
" label: '北京',",
" value: 'beijing',",
" disabled: false",
" },",
" {",
" label: '上海',",
" value: 'shanghai',",
" disabled: false",
" },",
" {",
" label: '重庆',",
" value: 'chongqing',",
" disabled: false",
" },",
" {",
" label: '天津',",
" value: 'tianjin',",
" disabled: true",
" }",
" ]",
" }",
" },",
" methods: {",
" onChange (e) {",
" console.log(e.target.value)",
" }",
" },-->",
],
"description": "AntdVue单选框组代码片段"
},
"WpAntdVueRadioButtonGroupSnippet": {
"prefix": "w-radio-button-group",
"body": [
"<a-radio-group v-model=\"value\" button-style=\"solid\" @change=\"onChange\">",
" <a-radio-button v-for=\"(item, index) in options\" :key=\"index\" :value=\"item.value\" :disabled=\"item.disabled\">{{",
" item.label",
" }}</a-radio-button>",
" </a-radio-group>",
" <!-- data () {",
" return {",
" value: '',",
" options: [",
" {",
" label: '北京',",
" value: 'beijing',",
" disabled: false",
" },",
" {",
" label: '上海',",
" value: 'shanghai',",
" disabled: false",
" },",
" {",
" label: '重庆',",
" value: 'chongqing',",
" disabled: false",
" },",
" {",
" label: '天津',",
" value: 'tianjin',",
" disabled: true",
" }",
" ]",
" }",
" },",
" methods: {",
" onChange (e) {",
" console.log(e.target.value)",
" }",
" },-->",
],
"description": "AntdVue单选按钮组代码片段"
},
"WpAntdVueRateSnippet": {
"prefix": "w-rate",
"body": [
"<a-rate",
" v-model=\"value\"",
" allow-half",
" :tooltips=\"desc\"",
" :disabled=\"disabled\"",
" :count=\"count\"",
" @change=\"onChange\">",
" <template #character>",
" <a-icon type=\"star\" />",
" </template>",
" </a-rate>",
" <!-- data () {",
" return {",
" value: 0,",
" disabled: false,",
" count: 10,",
" desc: ['terrible', 'bad', 'normal', 'good', 'wonderful']",
" }",
" },",
" methods: {",
" onChange () {",
" console.log(this.value)",
" }",
" }, -->",
],
"description": "AntdVue评分代码片段"
},
"WpAntdVueSelectSnippet": {
"prefix": "w-select",
"body": [
"<a-select",
" label-in-value",
" v-model=\"value\"",
" placeholder=\"请选择一项\"",
" style=\"width: 300px\"",
" mode=\"tags\"",
" :allowClear=\"true\"",
" :token-separators=\"[',', ',', ' ']\"",
" :options=\"options\"",
" @change=\"onChange\"",
" @select=\"onSelect\"",
" >",
" <!-- <template #suffixIcon> <a-icon type=\"setting\" /></template>仅当mode='default'时有效 --> </a-select",
" ><!-- mode='default' | 'multiple' | 'tags' | 'combobox'",
" :token-separators=\"[',', ',', ' ']\"-->",
" <!-- data () {",
" return {",
" value: [],",
" options: [",
" {",
" label: '北京',",
" value: 'beijng',",
" disabled: false",
" },",
" {",
" label: '上海',",
" value: 'shanghai',",
" disabled: false",
" },",
" {",
" label: '重庆',",
" value: 'chongqing',",
" disabled: false",
" },",
" {",
" label: '天津',",
" value: 'tianjin',",
" disabled: true",
" }",
" ]",
" }",
" },",
" methods: {",
" onChange (val) {",
" val.map((v) => {",
" console.log(`key:${v.key} label:${v.label}`)",
" })",
" },",
" onSelect (val) {",
" this.value.map((v) => {",
" console.log(`this.key:${v.key} this.label:${v.label}`)",
" })",
" }",
" }, -->",
],
"description": "AntdVue选择器代码片段"
},
"WpAntdVueSelectGroupSnippet": {
"prefix": "w-select-group",
"body": [
"<a-select",
" label-in-value",
" v-model=\"value\"",
" placeholder=\"请选择一项\"",
" style=\"width: 300px\"",
" mode=\"multiple\"",
" :allowClear=\"true\"",
" @change=\"onChange\"",
" @select=\"onSelect\"",
" >",
" <!-- <template #suffixIcon> <a-icon type=\"setting\" theme=\"twoTone\" two-tone-color=\"#52c41a\" /> </template>仅当mode='default'时有效 -->",
" <!-- mode='default' | 'multiple' | 'tags' | 'combobox'",
" :token-separators=\"[',', ',', ' ']\"-->",
" <a-select-opt-group>",
" <template #label> <a-icon type=\"setting\" theme=\"twoTone\" two-tone-color=\"#52c41a\" />直辖市</template>",
" <a-select-option v-for=\"(item, index) in options\" :key=\"index\" :value=\"item.value\">{{",
" item.label",
" }}</a-select-option>",
" </a-select-opt-group>",
" </a-select>",
" <!-- data () {",
" return {",
" value: [],",
" options: [",
" {",
" label: '北京',",
" value: 'beijng',",
" disabled: false",
" },",
" {",
" label: '上海',",
" value: 'shanghai',",
" disabled: false",
" },",
" {",
" label: '重庆',",
" value: 'chongqing',",
" disabled: false",
" },",
" {",
" label: '天津',",
" value: 'tianjin',",
" disabled: true",
" }",
" ]",
" }",
" },",
" methods: {",
" onChange (val) {",
" val.map((v) => {",
" console.log(`key:${v.key} label:${v.label}`)",
" })",
" },",
" onSelect (val) {",
" this.value.map((v) => {",
" console.log(`this.key:${v.key} this.label:${v.label}`)",
" })",
" }",
" }, -->",
],
"description": "AntdVue分组选择器代码片段"
},