Vant: tabbar自定义图标求助

Created on 10 Oct 2018  ·  1Comment  ·  Source: youzan/vant

IMPORTANT: Please use the following link to create a new issue. If your issue was not created using the app above, it will be closed immediately.

注意:请按照下面的模板来新建 issue,不规范的 issue 会被立即关闭.

Describe the bug
A clear description of what the bug is.

tabbar里面自定义图标这里,我没搞清楚,demo里面写的是绝对路径

icon: {
        normal: 'https://img.yzcdn.cn/public_files/2017/10/13/c547715be149dd3faa817e4a948b40c4.png',
        active: 'https://img.yzcdn.cn/public_files/2017/10/13/793c77793db8641c4c325b7f25bf130d.png'
      }

我这里需要写成相对路径,但是预览时图片显示不出来,路径不对

icon: {
            normal: 'assets/images/home.png',
            active: 'assets/images/home-active.png',
          }

dom里面就直接解析成这样了<img src="assets/images/home-active.png">

我看了tabbar之外显示得出来的图,他们的路径是

<img data-v-56b687e3="" src="/static/img/slide1.31e43d0.png" alt="">

或者

<img data-v-56b687e3="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAACTUlEQVRoQ+1Zv4oaQRj/zerGqGiySJqkCUKEFClEkBTiHWjhAwQrUyUwFoHkDY7kCdLtDgS2SCpfIl5jG+GKgzshhWAhiI2gKLphNi54p+KwrrunzFS6fDPf9/uzO8M3BCcyyInggATy0JSUikhFDsTARmsZhvGBEPINwPMD5XWzbA/ABaX0x6bJa0AMw6gRQn66yeTHHMuy3tfr9V/3c60BYYzdAHi1DBwDmPpR4I4cjwBElzG3lNKMCBBrGXStadqbarU6DxpIo9EIDYfDKwCveS2U0jUBNiniALmklJ4HDcLJzxhrAjiTQE5SkV6v59jOd3ytVguDwcDO6+odMU3z8WQyecsXKBQKv/1GoGkaFEXB3kB0XX+pKMpfvwE4+UqlEmKxmATCCbE/v1IRj7worcUYu7OzS2tJa91lwLN3xDTNp9Pp9AtfPpPJXHhEtPAy6XQaqqruv4+sZjzqI4oEImwescC9z1pSETGihaOkIs6hUVpL2DRigZ5YizH2CcC7VCpldzH4CIfDyOfz9u9+v49Op7O1okgkglwuJ1bxlihPgBiG8Z0Q8nk1B99tK5WK/ajb7aLdbm8tNBqNolwuSyCcAU8U0XX9RSgUelYsFv+s0ppMJu2/s9kM4zHvrm4ehBAkEongFXEqONaz1lrvNygglmWh2WxiNBrZnIr2tbZ241VVfbKXP1xOXiwWmM//99Lj8ThqtdruJvZDvx/JZrP8s78bCEfNGPsI4OtR31i5VD/wafJ6OnAJ7hUgFZGKHIgBaa0DEet62X8mAOxCmTQn5gAAAABJRU5ErkJggg==" alt="">

这里是我搞错了吗?应该怎么写呢?

Screenshots
Add screenshots to help explain your problem.

home

Environment

  • Device: win10
  • Browser: chrome
  • Vant Version: 1.3.5

Reproduce
Provide the steps to reproduce and if possible a minimal demo of the problem via jsfiddle.
https://jsfiddle.net/dfarLdko/1/

Most helpful comment

想通了,用

icon: {
            normal: require('./assets/images/home.png'),
            active: require('./assets/images/home-active.png'),
          },

>All comments

想通了,用

icon: {
            normal: require('./assets/images/home.png'),
            active: require('./assets/images/home-active.png'),
          },
Was this page helpful?
0 / 5 - 0 ratings