成功vue使用公共方法

(1)任意创建js文件Common.js
export default{
    rowClass:function({ row, column, rowIndex, columnIndex}) {
        return 'background-color:#5768cc;color:white;'
    }
}
(2)main.js中引用创建js文件
import CommonJs from "@/utils/Common.js";
Vue.prototype.CommonJs = CommonJs;//引用公共js文件
(3)页面中引用CommonJs.rowClass
 <el-table
      v-loading="listLoading"
      :data="list.slice((currentPage - 1) * pageSize, currentPage * pageSize)"
      element-loading-text="Loading"
      border
      fit
      highlight-current-row
      :header-cell-style="CommonJs.rowClass"
    >
      <el-table-column prop="test1" label="测试名称1" align="center"></el-table-column>
      <el-table-column prop="test2" label="测试名称2" align="center"></el-table-column>
      <el-table-column prop="test3" label="测试名称3" align="center"></el-table-column>
      <el-table-column label="操作" align="center" min-width="200px">
        <template slot-scope="scope">
          <el-button type="info" icon="el-icon-message" @click="checkDetail(scope.row)" circle></el-button>
          <el-button type="primary" icon="el-icon-edit" @click="modifyData(scope.row)" circle></el-button>
          <el-button type="danger" icon="el-icon-delete" @click="deleteData(scope.row)" circle></el-button>
        </template>
      </el-table-column>
    </el-table>

(0)

相关推荐