vue element 常见问题

 1 // 数据
 2 data() {
 3   return {
 4     ossData: {
 5       signature: '' 
 6     }
 7   }
 8 }
 9 
10 //  正确用法
11 this.$set(this.ossData, "signature", 222)　
12 
13 //  错误用法
14 this.ossData.signature = 24

1 typeCode(newValue, oldValue) {　　　　//watch
2   this.$set(this.listQuery, 'typeCode', newValue)
3   this.getList()
4 }

 1 resolve: {
 2   extensions: ['.js', '.vue', '.json'],
 3   alias: {
 4     '@': resolve('src')
 5   }
 6 },
 7 plugins: [
 8   new VueLoaderPlugin(),
 9 //  jquery开始 
10   new webpack.ProvidePlugin({
11     jQuery: "jquery",
12     $: "jquery"
13   })
14 // jquery结束
15 ],

1 propE: {
2   type: Object,
3   default: function () {
4     return {}
5   }
6 }

 1 // html
 2 <ul>
 3     <li v-for="item in people" ref="refContent">{{item}}</li>
 4 </ul>
 5 
 6 // js
 7 data: {
 8  people:['三姑','四婶','五叔','六姨','七舅姥爷']
 9 },
10 created: function() {
11  this.$nextTick(() => {
12 　　//  refContent: 存在n个
13   console.log(this.$refs.refContent[0])
14  })
15 }

1 // 使用 trim 修饰符
2 <input type="text" v-model.trim="content">
3 
4 // 使用 filter 属性
5 <input type="text" v-model="name" />
6 <p>  {{ name | trim }}</p>　

 1 // 父组件
 2 <kind-editor :content.sync="editorText" />
 3 
 4 // 子组件
 5 <input v-model="editorText" />
 6 watch: {
 7   content(val) {
 8     this.editorText = val
 9   },
10   editorText(val) {
11     this.$emit('update:content',val)
12   }
13 }

uploadImg (f) {
  this.axios.get('./getToken').then((response) => {//获取token
    let param = new FormData(); //创建form对象
    param.append('file',f.file);//通过append向form对象添加数据
    param.append('token',response.data.token);//通过append向form对象添加数据
    param.append('key',response.data.key);//添加form表单中其他数据
    let config = {
      headers:{'Content-Type':'multipart/form-data'}
    };  //添加请求头
    this.axios.post(f.action,param,config)//上传图片
      .then(response=>{
        onSuccess(response.data)
      })
      .catch(({err}) => {
        f.onError()
      })
  })
    .catch(() => {
      f.onError()
    })
},

 1 // 修改前
 2 import { interNal } from '@/utils/internalReference'
 3 exports.install = function (Vue, options) {
 4   Vue.prototype.filter_rules = function(item) {
 5   }
 6 }
 7 
 8 // 修改后
 9 import { interNal } from '@/utils/internalReference'
10 export default {
11   install(Vue) {
12     Vue.prototype.filter_rules = function(item) {
13     }
14   }}

1 "scripts": {
2 "dev": "cross-env BABEL_ENV=development webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 192.168.8.123",
3 "build:prod": "cross-env NODE_ENV=production env_config=prod node build/build.js",
4 "build:sit": "cross-env NODE_ENV=production env_config=sit node build/build.js",
5 "lint": "eslint --ext .js,.vue src",
6 "test": "npm run lint",
7 "precommit": "lint-staged",
8 "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml"
9 },

1 // 由于node.js依赖问题，经常出现node_modules文件夹层次过深，从而导致windows无法直接删除。可以全局安装rimraf来解决：
2 npm install rimraf -g
3 
4 // 用法
5 rimraf node_modules

 1 <el-transfer
 2   ref="elTransfer"
 3   :titles="[$t('common.altRobot'), $t('common.selectedRobot')]"
 4   v-model="addEditForm.snBoundList"
 5   :data="updateDialog.sn"
 6   :filter-placeholder="$t('common.inpSNSearch')"
 7   filterable/>
 8 
 9 this.$nextTick(() => {
10   this.$refs.elTransfer.clearQuery('left')
11   this.$refs.elTransfer.clearQuery('right')
12 })