Vue專案三 首頁,城市 json的實現

2021-08-27 11:30:04 字數 711 閱讀 4697

一周多沒寫部落格了,沒覺得時間多久,其實已經十天了,人都是有惰性的。今天總結一下這一周的開發內容。

其實主要分為兩個前端頁面:首頁旅遊景點,和城市的本地json資料顯示。

效果圖:

實現下拉下面還有。

一部分**: city.vue

list.vue

熱門城市

}}

主要就是傳遞ajax值用了元件:

import axios from 'axios'
methods: ,

handlegetcityinfosucc (res)

}},mounted ()

然後引用子元件list.vue: citylist ,逐步實現v-for 迴圈輸出。在實現下拉框時候

用了外掛程式:better-scroll

import bscroll from 'better-scroll'

export default ,

mounted () )

}

用了最新的谷歌瀏覽器。

2 2 首頁元件的拆分

render detail 其中,browserrouter 表示路由,route 表示路由規則。當路徑匹配到 時,就會顯示 home 當路徑匹配 detail 時,就會顯示detail。接下來,我們要換一種形式,對路由規則進行公升級。首先,在src 目錄下,新建乙個目錄 pages。然後,在pag...

專案實戰 點餐小程式 18 首頁 選擇門店

一 功能需求 顯示當前位置 從資料庫獲取所有門店的資訊 各個門店 點選對應按鈕實現打 聯絡,導航到門店 與其他頁面互動點選門店資訊,攜帶門店資訊跳轉到門店詳情頁 shopdetail 點選 選這家 按鈕,攜帶門店資訊跳轉到首頁 home 二 實現 1.shop.wxml 1 2 view class...

專案實戰 點餐小程式 17 首頁 選擇門店

一 功能需求 頁面展示預設門店 門店名稱 門店 導航位址 點選聯絡 調取撥打預設門店的聯絡 點選 導航前往 調取手機地圖軟體進行導航 與其他頁面互動 點選預設門店名稱,跳轉到選擇門店頁面 二 實現 1.home.wxml 1 2 view class chooseshop 3 view class ...