评价

TIP

1.0.0+

普通用法

评价 - 图1

  1. <avue-form v-model="form" :option="option" @submit="submit"></avue-form>
  3. <script>
  4. export default {
  5.     data() {
  6.       return {
  7.         form:{},
  8.         option:{
  9.           labelWidth: 120,
  10.           column: [{
  11.               label: '非常一般的',
  12.               prop: 'score1',
  13.               type: 'rate',
  14.           }, {
  15.               label: '自定义辅助文字',
  16.               prop: 'score2',
  17.               type: 'rate',
  18.               showText: true,
  19.               texts: ['极差', '失望', '一般', '满意', '惊喜'],
  20.           }, {
  21.               label: '自定义颜色',
  22.               prop: 'score3',
  23.               type: 'rate',
  24.               colors: ['#99A9BF', '#F7BA2A', '#FF9900']
  25.           }, {
  26.               label: '自定义图标',
  27.               prop: 'score4',
  28.               type: 'rate',
  29.               iconClasses: ['el-icon-circle-close', 'el-icon-remove', 'el-icon-circle-plus'],
  30.               voidIconClass: "el-icon-circle-plus-outline",
  31.               colors: ['#99A9BF', '#F7BA2A', '#FF9900']
  32.           }, {
  33.               label: '自定义个数',
  34.               prop: 'score',
  35.               type: 'rate',
  36.               span: 24,
  37.               row: true,
  38.               max: 40
  39.           }]
  40.         }
  41.       };
  42.     },
  43.     methods: {
  44.      submit(){
  45.        this.$message.success('当前数据'+JSON.stringify(this.form))
  46.      }
  47.     }
  48. }
  49. </script>