elementuiplus formatter参数
    ElementUIPlus组件库是Vue.js开发中常用的UI组件库之一,其中有一些组件会用到 formatter 参数,用来格式化显示数据。下面介绍一下 formatter 参数的用法。
    一、概述
    在 ElementUI Plus 组件库中,一些组件(如表格、下拉框等)支持 formatter 参数。这个参数是一个函数,用来格式化显示数据。在使用 formatter 参数时,可以处理一些特定的需求,比如将数据格式化为货币、日期、百分比等形式。
    二、参数格式
    formatter 参数是一个函数,有一个参数,参数值是当前单元格的值,返回值是显示在单元格里的值。具体格式如下:
    ```
    formatter(row, column, cellValue, index)
    ```
    参数解释:
    - row:当前行的数据
    - column:当前列的配置信息
    - cellValue:当前单元格的值
    - index:当前行的索引
    三、示例
    以表格组件为例,展示 formatter 参数的用法。
    1. 将数据格式化为货币
    ```html
html文件格式化    <el-table :data='tableData'>
    <el-table-column prop='price' label='价格' :formatter='formatPrice'>
    </el-table-column>
    </el-table>
    ```
    ```js
    methods: {
    formatPrice(cellValue) {
    return ` ${parseFloat(cellValue).toFixed(2)}`
    }
    }
    ```
    2. 将数据格式化为日期
    ```html
    <el-table :data='tableData'>
    <el-table-column prop='date' label='日期' :formatter='formatDate'>
    </el-table-column>
    </el-table>
    ```
    ```js
    methods: {
    formatDate(cellValue) {
    const date = new Date(cellValue)
    return `${FullYear()}-${Month() + 1}-${Date()}`
    }
    }
    ```
    3. 将数据格式化为百分比
    ```html
    <el-table :data='tableData'>
    <el-table-column prop='percent' label='百分比' :formatter='formatPercent'>
    </el-table-column>
    </el-table>
    </el-table>
    ```
    ```js
    methods: {
    formatPercent(cellValue) {
    return `${parseFloat(cellValue * 100).toFixed(2)}%`
    }
    }
    ```
    四、总结
    在 ElementUI Plus 组件库中,formatter 参数可以帮助我们将数据格式化为符合需求的形式。我们可以根据具体的需求,自定义 formatter 函数,实现数据的格式化。