img标签src属性路径没错,高度也有为什么不显示图片?求解答。

img


<template>
    <div id="tab-bar">
      <div class="tab-bar-item">
          <img src="/src/assets/img/1.svg" alt="">
          首页
      </div>
      <div class="tab-bar-item">
          <img src="/src/assets/img/2.svg" alt="">
          分类         
      </div>
      <div class="tab-bar-item">
          <img src="/src/assets/img/3.svg" alt="">
          购物车
      </div>
      <div class="tab-bar-item">         
          <img src="/src/assets/img/4.svg" alt="">
          我的      
      </div>
      <img src="/src/assets/img/630 (3).png" alt="">
     
    </div> 
</template>
<script>
    export default {
        name: "TabBar"
    }
</script>

<style scoped>
#tab-bar {
    display: flex;
    background-color: #f6f6f6;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    box-shadow: 0 -1px 1px rgba(100, 100, 100, .1);
}
.tab-bar-item img {
    width: 24px;
    height: 24px;
}
</style>
![img](https://img-mid.csdnimg.cn/release/static/image/mid/ask/054305029136129.png "=600 #left")

```javascript

```javascript



直接@/assets/logo.png

@/ 代表 src/,这种写法在项目任何地方都能用,可以忽略当前文件的位置

也可能是你在src前多加了个/

假设你的src是img/img_1.png说明img文件夹和本页面是同一级(同一目录下),如果img文件夹和本页面的父文件夹同一级,则src为../img/img_1.png,../表示更外一层文件夹,不这样找不到文件的.

这个要看你的具体路径,

目前你设置的是相对路径,跑起来后,看看能不能直接访问到图片,如果可以,那就是路径设置问题,

如果不行,那就是图片的权限问题

我看了别人的回答,如果不行的话,你尝试用import 倒入图片,然后放在src 后面,

这个跟你当前文件的路径和头图所在路径是有关系的。发一个你目录结构的图来看看。

用..(点点)表示上一级,这种试试

我的目录结构是这样的,用下面的代码能正常显示。

img

img