vue 动态设置img的值

需求：依据当前路由点击按钮图片实现img

如果直接在:src中写路径会获取不到

<img :src="'/god'==$route.path?'./images/icon_index_sel.png':'./images/icon_index_nor.png'">

这样写的话会

获取不到

解决方法：

先引入图片

import index_nor from './images/icon_index_nor.png'
import index_sel from './images/icon_index_sel.png'

data(){
  return {
    imgUrl:{
      index_nor,
      index_sel,
	}
	}
}

使用

<span class="guide_item" :class="{'on':'/home'==$route.path}" @click="goTo('/home')">
  <span class="item_icon">
    <img :src="'/home'==$route.path?imgUrl.index_sel:imgUrl.index_nor">
  </span>
  <span>首页</span>
</span>