view table中显示图片以及超链接

view table中显示图片以及超链接

通常显示图片

图片地址值为：http://static.upedu.cc/upload/Dev/logo/20190805/1565012617678291821.png

{
          key: 'picture',
          title: '图片',
          width: 120,
          align: 'center',
          render:(h,params)=>{
            return h('img',{
              attrs:{
                src:params.row.picture,
              },
              style:{
                width:'93px',
                height:'74px'
              }
            })
          }
        },

显示base64的图片

图片地址值为：

data:image/jpeg;base64,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

重点：domProps

{
          key: 'picture',
          title: '图片',
          width: 120,
          align: 'center',
          render:(h,params)=>{
            return h('img',{
              domProps:{
                src:params.row.picture,
              },
              style:{
                width:'93px',
                height:'74px'
              }
            })
          }
        },

显示超链接

{
          key: 'title',
          title: '标题',
          align: 'left',
          render:(h,params)=>{
            return h('a',{
              domProps:{
                href: params.row.url,
                target:'_blank',
                title:params.row.title
              }
            },params.row.title)
          }