element-ui 列表 type="selection"设置默认选中

这个业务逻辑多少都有点奇怪了，阅读浏览次数增值在新闻详情页的控制器方法里setInc，这怎么还写进模型事件里了。如果非要用onAfterRead也可以，把新闻文章的内容单独分出来一个news_content表，然后把它和news做关联，然后给news_content表的onAfterRead事件做增值处理，这样点进新闻页内查询到文章内容时才会触发它。: 评 TP6模型事件-查询后onAfterRead不好用

文章标签更多

ThinkPHP (254)

Mysql (58)

DedeCms (33)

jQuery (67)

证件照 (1)

尺寸大小 (2)

背景颜色 (1)

setInc (4)

setDec (4)

onclick (5)

友情链接更多

超纯水设备

免费设计

海报设计

快递查询

element UI

打开边栏(ESC) 关闭边栏(ESC)

element-ui 列表 type="selection"设置默认选中

进入模块后的效果图

from clipboard

列表html代码

这里需要注意的是el-table一定要有ref属性，比如ref="table"

  <div style="padding:0 1%;">
            <el-table  :data="lists"  v-loading="loading" ref="table" tooltip-effect="dark" @selection-change="handleSelectionChange" :height="height-220" border align="center">
            <el-table-column 
                type="selection"
                :width="width*0.05"> 
            </el-table-column>
            <el-table-column type=index label="序号" :index="typeIndex" :width="width*0.05" align="center"></el-table-column>  
            <el-table-column prop="picimg" label="图片" :width="width*0.25" align="center">
                <template slot-scope="scope">
                    <img  :src="scope.row.picimg" alt="" style="width: 100px;height:50px">
                </template>
            </el-table-column>
            <el-table-column prop="title" label="产品简称" :width="width*0.25" align="center"></el-table-column>
            <el-table-column prop="depict" label="产品描述" :width="width*0.25" align="center"></el-table-column>
            <el-table-column prop="picimg" label="图片" :width="width*0.25" align="center">
                <template slot-scope="scope">
                    <img  :src="scope.row.picimg" alt="" style="width: 100px;height:50px">
                </template>
            </el-table-column>
          
            </el-table>
           
        </div>

methods中的代码

请求完列表后进行回调操作，this.$refs.table.toggleRowSelection(this.lists[i],true) 是官网中给出的方法，第一个参数是需要被勾选的行组成的列表，第二个参数为true，必须要传。

getList(){
            let data={
                pageModel:{
                    pageNo:this.pageNo,
                    pageSize:this.limit
                },
                shop:{
                    style:this.radio
                }
            }
            listShop(data).then(res =>{
                this.total = res.data.data.total
                this.lists = res.data.data.rows.filter(res=>{
                    return res.isdelete == '0'
                })
            })
            //请求完列表后，回调，过滤需要被勾选的
            .then(()=>{
                for(let i=0;i<this.lists.length;i++){
                    if(this.lists[i].style == this.radio){
                        this.$refs.table.toggleRowSelection(this.lists[i],true);
                    }
                }
            })
        },

实际使用：发货系统，用户选择添加产品

from clipboard

赏

前一篇

“最难不过坚持”

本人承接扒站仿站，php网站维护，病毒查杀，网站编辑，网站改版，html制作

el-table-column :label换行