一、首先出现的是比较复杂的一种情况(多个key)

1、首先页面显示效果如下

  

2、后台返回数据格式如下:  

3、在iview中table的columns中的render函数:

  

4、具体代码

render: (h, params) => {

return h('ul', this.classroomList[params.index].knowledge.map(item => {

return h('li', item.knowledgeName)
}))
}

二、比较简单的情况(后台返回的纯数组)例如

1、在iview中table的columns中的render函数:

 

实例代码 

return h('span', {

style: {
display: 'inline-block',
width: '100%',
margin: '10px',
overflow: 'hidden',
textOverflow: 'hiddden'
}

}, params.row.knowledge.join('\n'))

3、效果如下

  

  

iview 中table列 一列显示多个数据(后台返回数组显示在列内)的更多相关文章

  1. iview中table里嵌套i-switch、input、select等

    iview中table内嵌套 input render:(h,params) => { return h('Input',{ props: { value:'', size:'small', } ...

  2. iview中table的render()函数

    Vue 推荐在绝大多数情况下使用 template 来创建你的 HTML.然而在一些场景中,你真的需要 JavaScript 的完全编程的能力,这就是 render 函数,它比 template 更接 ...

  3. iview中table多选、加载更多、下载等使用

    记录工作中的点点滴滴,为回忆过往添加片片记忆... 一.Table 1.使用render函数多层渲染以及表格可展开使用 源码地址:https://gitee.com/Mandy_wang/iview- ...

  4. Springmvc中 同步/异步请求参数的传递以及数据的返回

    转载:http://blog.csdn.net/qh_java/article/details/44802287 注意: 这里的返回就是返回到jsp页面 **** controller接收前台数据的方 ...

  5. springmvc中同步/异步请求参数的传递以及数据的返回

    注意: 这里的返回就是返回到jsp页面 **** controller接收前台数据的方式,以及将处理后的model 传向前台***** 1.前台传递数据的接受:传的属性名和javabean的属性相同 ...

  6. Echart中X轴为时间坐标刻度时,后台返回时间List被强制转化为时间戳问题

    if(recordlist!=null&&recordlist.size()>0) { for (Record record : recordlist) { //根据频次决定使用 ...

  7. phpmyadmin数据表结构没有显示注释列

    新开的一个项目,用phpmyadmin作为图形化操作数据库工具.创建数据表时为其每列添加好注释,浏览数据表内容有显示注释内容,但是查看数据表结构没有显示注释列,不方便直观查看数据表每列的意思. 上网搜 ...

  8. Dede后台验证码不显示解决方法详解(dedecms 5.7)

    今天朋友问我他本地与服务器上安装了dedecms5.7无法显示验证码,一般这种情况很少见,一般情况就是服务器设置问题,还有临时目录的权限问题 Dede后台验证码不显示或不正常分三种情况,下面来逐一分析 ...

  9. Dede后台验证码不显示解决方法详解(dedecms 5.7 UTF-8版本)

    织梦(dede)后台验证码不显示有多种可能性,我前几天测试就碰到了这个问题,结果百度搜索了一圈,挨个修改了下,还是不行,最后是在解决另外一个后台上传图片不成功的问题的时候,歪打正着的把验证码问题给解决 ...

随机推荐

  1. github上创建java项目简单操作

    github上创建java项目简单操作 参考L: github上创建java项目简单操作 - CSDN博客http://blog.csdn.net/qq_29392425/article/detail ...

  2. System.Web.Mvc.PartialViewResult.cs

    ylbtech-System.Web.Mvc.PartialViewResult.cs 1.程序集 System.Web.Mvc, Version=5.2.3.0, Culture=neutral, ...

  3. 一行神奇的 javascript 代码

    写本篇文章的缘由是之前群里@墨尘发了一段js代码,如下: (!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!+[]]+({}+[])[[~!+[]]*~ ...

  4. Vue中的better-scroll插件

    Vue中的better-scroll插件 在需要的文件中添加 import BScorll from 'better-scroll'; 引用的示例代码: let scroll = new BScrol ...

  5. Python学习day42-数据库的基本操作(1)

    figure:last-child { margin-bottom: 0.5rem; } #write ol, #write ul { position: relative; } img { max- ...

  6. vue 打包后app.css,verondor.js文件过大

    参考:https://blog.csdn.net/feiyu_may/article/details/80987404         https://blog.csdn.net/qq_4199961 ...

  7. hdu1693 Eat the Trees [插头DP经典例题]

    想当初,我听见大佬们谈起插头DP时,觉得插头DP是个神仙的东西. 某大佬:"考场见到插头DP,直接弃疗." 现在,我终于懂了他们为什么这么说了. 因为-- 插头DP很毒瘤! 为什么 ...

  8. 通过media媒体查询设置ie7/8样式、使用media判断各机型、手淘flexible.js

    @media all and (min-width:1280px){ /* 所有设备宽度大于1280干嘛干嘛嘞... */ body{ background:#f00; } } @media (min ...

  9. ACM常用的Java代码

    import java.util.*; import java.io.*; public class Main { public static void main(String[] args) thr ...

  10. 查看JDK的安装路径 和 安装版本

    查看JDK的安装路径: 打开 运行,输入 cmd .  输入: java -verbose                      (ps:java后面必须敲一个空白格) 得到下图:  最后的两行, ...