首页搜索，暂无数据时显示的页面

pages/index/search/index.vue

@@ -28,49 +28,57 @@
 		</view>
 
 	</view>
-
+	<view style="display: flex;flex-direction: column;align-items: center;" v-if="!datas.isSearch&&datas.keywordList.length==0">
+		<image src="/static/index/none.png" style="width: 341rpx;height: 341rpx;" mode=""></image>
+		<text style=";">暂无数据</text>
+	</view>
 </template>
 
 <script setup>
-import { selectCourseTitles } from '@/api/index/index.js'
-import videoList from './videoList.vue'
-import {
+	import {
+		selectCourseTitles
+	} from '@/api/index/index.js'
+	import videoList from './videoList.vue'
+	import {
 		reactive
-} from 'vue';
-import {
-	onShow, onReachBottom
-} from '@dcloudio/uni-app'
-let datas = reactive({
+	} from 'vue';
+	import {
+		onShow,
+		onReachBottom
+	} from '@dcloudio/uni-app'
+	let datas = reactive({
 		hotKeywordList: [], //热搜
-	keywordList: [],// 搜索列表
-	keyword: "",// 搜索关键字
+		keywordList: [], // 搜索列表
+		keyword: "", // 搜索关键字
 		page: 1,
 		isSearch: true,
-})
-onShow(() => {
+	})
+	onShow(() => {
 		getList()
-})
+	})
 
-function posterSuccess() {
+	function posterSuccess() {
 
-}
-function getList() {
+	}
+
+	function getList() {
 		if (uni.getStorageSync('moreSearch')) {
 			datas.hotKeywordList = (uni.getStorageSync('moreSearch')).split(',')
 		} else {
 			datas.hotKeywordList = []
 		}
-}
-onReachBottom(() => {
+	}
+	onReachBottom(() => {
 		++datas.page
 		doSearch()
-})
-function doSearchs(keyWord) {
+	})
+
+	function doSearchs(keyWord) {
 		datas.keyword = keyWord
 		doSearch()
-}
-// 搜索
-async function doSearch() {
+	}
+	// 搜索
+	async function doSearch() {
 		datas.isSearch = false
 		let res = await selectCourseTitles({
 			title: datas.keyword,
@@ -83,16 +91,16 @@ async function doSearch() {
 			datas.keywordList = [...datas.keywordList, ...res.list]
 		}
 
-}
+	}
 
-// 取消返回首页
-function goBack() {
+	// 取消返回首页
+	function goBack() {
 		uni.navigateBack()
-}
+	}
 </script>
 
 <style scoped lang="scss">
-.search-box {
+	.search-box {
 		width: 100%;
 		/* background-color: rgb(242, 242, 242); */
 		padding: 15upx 2.5%;
@@ -101,17 +109,17 @@ function goBack() {
 		// position: sticky;
 		// top: 0;
 		background-color: #ffffff;
-}
+	}
 
-.search-keyword {
+	.search-keyword {
 		width: 100%;
-}
+	}
 
-.keyword-block {
+	.keyword-block {
 		padding: 10rpx 0;
-}
+	}
 
-.keyword {
+	.keyword {
 		width: 94%;
 		padding: 3px 3%;
 		display: flex;
@@ -131,23 +139,23 @@ function goBack() {
 			background: #E6EBFF;
 			color: #6b6b6b;
 		}
-}
+	}
 
-.keyword-block .keyword-list-header {
+	.keyword-block .keyword-list-header {
 		width: 94%;
 		padding: 10rpx 3%;
 		font-size: 27rpx;
 		color: #333;
 		display: flex;
 		justify-content: space-between;
-}
+	}
 
-.keyword-block .keyword-list-header image {
+	.keyword-block .keyword-list-header image {
 		width: 40rpx;
 		height: 40rpx;
-}
+	}
 
-.search-list {
+	.search-list {
 		width: 100%;
 		margin-top: 20rpx;
 		display: flex;
@@ -162,5 +170,5 @@ function goBack() {
 			width: 686rpx;
 			height: 100%;
 		}
-}
+	}
 </style>