老师我这个下拉动画一开始就存在，并且在init中也执行了this.mescroll.endScroll()

Question

search-result

	<view>	
		<view>
			<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" :up="upOption" @up="upCallback">
			<block v-for="(item, index) in resultList" :key="item.id">
				<search-result-item-theme-1
					:data="item"
					v-if="!item.pic_list"
				></search-result-item-theme-1>
				<search-result-item-theme-3
					:data="item"
					v-else-if="item.pic_list.length === 3"
				></search-result-item-theme-3>
				<search-result-item-theme-2
					:data="item"
					v-else
				></search-result-item-theme-2>
			</block>
			</mescroll-body>
		</view>
	</view>
</template>

<script>
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import { getSearchResult } from '../../api/search.js'
	import { mapState } from 'vuex'
	export default {
		name:"search-result",
		mixins: [MescrollMixin],
		props: {
			queryStr: {
				type: String,
				required: true
			}
		},
		data() {
			return {
				//页数
				page: 1,
				resultList: [],
				mescroll: null,
				isInit: true
			};
		},
		// created() {
		// 	this.loadSearchResult()
		// 	// this.isLoading = false
		// },
		mounted() {
		    // 通过 $refs 获取组件实例
		    this.mescroll = this.$refs.mescrollRef.mescroll;
		  },
		methods: {
			// 获取数据方法
			async loadSearchResult() {
				const { data: res } = await getSearchResult({
					q: this.queryStr,
					p: this.page
				})
				// 处理高亮的文本
				res.list.forEach(item => {
					item.title = item.title && item.title.replace(/<em>/g, "<em style='color: #f94d2a; margin: 0 2px'>")
					item.description = item.description && item.description.replace(/<em>/g, "<em style='color: #f94d2a; margin: 0 2px'>")
				})
				if (this.page === 1) {
					this.resultList = res.list
				} else {
					this.resultList = [...this.resultList, ...res.list]
				}
			},
			async mescrollInit(mescroll) {
				// this.mescroll = mescroll
				console.log(mescroll === this.mescroll)
				await this.loadSearchResult()
				this.isInit = false
				// console.log('首次加载', mescroll)
				this.mescroll.endSuccess()
				console.log(111111)
			},
			async downCallback() {
				if (this.isInit) return
				this.page = 1
				await this.loadSearchResult()
				this.mescroll.endSuccess()
			},
			async upCallback() {
				if (this.isInit) return
				this.page += 1
				await this.loadSearchResult()
				this.mescroll.endSuccess()
			}
		}
	}
</script>

<style lang="scss">

</style>
在这里输入代码

search-blog

<template>
	<view class="search-blog-container">
		<view class="search-blog-searchModel">
			<my-search
				:isShowUniSearch="true"
				:placeholderText="defaultText"
				v-model="searchValue"
				@onSearch="onSearch"
				@input="onInput"
				@onCancel="onCancel"
				@onClear="onClear"
				@onFocus="onFocus"
				@onBlur="onBlur"
			></my-search>
		</view>
		<view class="search-list-container card" v-if="showType === HOT_LIST">
			<search-list @onClickSearch="onSearch"></search-list>
		</view>
		<view class="search-history-container card" v-else-if="showType === SEARCH_HISTORY">
			<search-history @removeItem="removeItem" @clearAll="clearHistory" @handleHistoryToSearch="onSearch"></search-history>
		</view>
		<view class="search-result-container card" v-else>
			<search-result ref="mescrollItem" :queryStr="searchValue"></search-result>
		</view>
	</view>
</template>

<script>
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-more.js";
import { getDefaultText } from '../../../api/search.js'
const HOT_LIST = 0;
const SEARCH_HISTORY = 1;
const SEARCH_RESULT = 2
export default {
	name: 'search-blog',
	mixins: [MescrollMixin],
	data: () => {
		return {
			searchValue: '',
			defaultText: "默认的 placeholder",
			HOT_LIST,
			SEARCH_HISTORY,
			SEARCH_RESULT,
			// 默认情况下 || 点击了输入框的取消按钮，显示searchlist
			// 当获取焦点时 || 点击清空按钮， 显示searchhistory
			// 当点击item || 点击搜索历史 || 搜索按钮，显示searchResult
			showType: HOT_LIST
		}
	},
	created() {
		this.loadDefaultText()
	},
	methods: {
		/**
		 * 获取搜索推荐文本
		 * @param {Object} val
		 */
		async loadDefaultText() {
			const { data: res } = await getDefaultText()
			this.defaultText = res.defaultText
		},
		onSearch(val) {
			this.searchValue = val ? val : this.defaultText
			if (this.searchValue) {
				this.showType = SEARCH_RESULT
			}
			this.$store.commit('search/addSearchData', this.searchValue)
		},
		onInput(val) {
			
		},
		onCancel() {
			this.showType = HOT_LIST
		},
		onClear() {
			this.showType = SEARCH_HISTORY
		},
		onFocus() {
			this.showType = SEARCH_HISTORY
		},
		onBlur() {
			
		}
	}
}
</script>

<style>
</style>

Answer 1

Sunday 2022-11-11 11:06:23

你好

你的问题是什么？是下拉刷新不行吗？

• 提问者 宝慕林5552628 #1

  是的，我下拉刷新的动画一直存在，也触发不了下拉函数

• Sunday 回复 提问者 宝慕林5552628 #2

  你是不是没有关闭下拉刷新。可以尝试触发下 this.mescroll.endSuccess() 关闭下拉刷新

• 提问者 宝慕林5552628 回复 Sunday #3

  我在mescrollInit，downCallback，upCallback最后都加上了this.mescroll.endSuccess()了，上拉刷新没问题，就是下拉加载一直存在

点开查看后面4条评论