• 评价
    • 普通用法

    评价

    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>