iview table render多图片并点击放大

{
          minWidth: 100,
          title: "图片/images",
          key: "image",
          render: (h, params) => {
            let pics = params.row.picture;//我这里是字符串,如果是数组,没必要写这个
            if (pics != null) {
              if (pics.length > 5) {
                let imgs = pics.replace(/"/g, "");
                var images = imgs.split(",");
                
                for (let i = 0; i < images.length; i++) {
                  images[i] = this.$uploadPicUrl + images[i];
                }
                //以上都是在拼数组
                return h(
                  "div",
                  images.map(item => {
                    return h("img", {
                      attrs: {
                        src: item,
                        style: "width:40px;height:40px;margin-right:5px"
                      },
                      on: {
                        click: () => {
                          this.showBigPic(item);//此处再用一个方法,建一个modal把图放大。
                        }
                      }
                    });
                  })
                );
              }
            }
            else
            {
              return h(
                'span',''
              )
            }
          }
        }
 
      
    
    showBigPic(item) {
    console.log(item);
    this.bigPicVisible = true;
    this.bigPicUrl = item;
    }

 

你可能感兴趣的:(妈妈喜欢文静的我)