图片引入问题

zhouwenxuan

2023-12-13 c71dc4c3abb3fcbbafc68b34e2bcb98cf0f8b346

 src/views/homePage.vue

@@ -34,16 +34,16 @@
          </div>
          <div :class="state.activeMenu == 4?'active': ''" @click="changeTab(4)">
            <List style="width: 1em; height: 1em; margin-right: 8px" />
            <div>信息公示</div>
            <div>机构公示</div>
          </div>
        </div>
      </div>
      <div class="content">
        <Home v-if="state.activeMenu==1" ref="homeRef" @toMore="changeTab"/>
        <Notice v-if="state.activeMenu==2" ref="noticeRef"/>
        <Laws v-if="state.activeMenu==3" ref="lawsRef"/>
        <Publish v-if="state.activeMenu==4" ref="publishRef"/>
        <Details ref="detailsRef"></Details>
        <Home v-if="state.activeMenu==1" ref="homeRef" @toMore="changeTab" @openDetails="openDetails"/>
        <Notice v-if="state.activeMenu==2" ref="noticeRef" @openDetails="openDetails"/>
        <Laws v-if="state.activeMenu==3" ref="lawsRef" @openDetails="openDetails"/>
        <Publish v-if="state.activeMenu==4" ref="publishRef" @openDetails="openDetails"/>
        <Details v-if="state.activeMenu==0" ref="detailsRef" @backJump="changeTab"></Details>
      </div>
    </div>
    <!--  底部  -->
@@ -60,8 +60,8 @@
import Notice from './components/notice'
import Laws from './components/laws'
import Publish from './components/publish'
import Details from './components/details'

import Details from './components/details.vue'
const { proxy } = getCurrentInstance()
const route = useRoute()
const router = useRouter()
// 时间格式化
@@ -79,7 +79,7 @@
const noticeRef = ref(null)
const lawsRef = ref(null)
const publishRef = ref(null)

const detailsRef = ref(null)
const state = reactive({
  activeMenu: 1,
  date: '',
@@ -130,21 +130,15 @@

const changeTab=(num)=>{
  state.activeMenu = num
  console.log(state.activeMenu)
  // if(num == 1){
  //   homeRef.value.getNoticeList()
  //   homeRef.value.getLawsList()
  //   homeRef.value.getPubList()
  // }
  // if(num == 2){
  //   noticeRef.value.getData()
  // }
  // if(num == 3){
  //   lawsRef.value.getData()
  // }
  // if(num == 4){
  //   publishRef.value.getData()
  // }
}

const openDetails=(type,id)=>{
  state.activeMenu = 0
  nextTick(() => {
    proxy.$refs.detailsRef.openDetail(type,id)
  })
  // detailsRef.value.openDetail(type,id)

}

</script>
@@ -221,7 +215,7 @@
          height: 100%;
          padding: 0 50px;
          color: #ffffff;
          background-color: #5175C0;
          background-color: #385ca7;
          font-size: 20px;
          text-decoration: none;
          display: flex;
@@ -230,11 +224,11 @@
          cursor: pointer;

          &:hover{
            background: #425f9f;
            background: #294582;
          }
        }
        .active{
          background: #425f9f;
          background: #385ca7;
        }
      }
    }
@@ -263,7 +257,7 @@
  width: 100%;
  text-align: center;
  color: #fff;
  background: #5175C0;
  background: #385ca7;
  font-family: "PingFang SC";
  font-size: 12px;
  letter-spacing: 1px;