xs/xs-app/pages/readbook/read.vue

<template>
	<readPage ref="readPages" @touchend="onClickView" @touchmove="hideSetting" v-for="(text,index) in book_text_list" :key="index" :text_content="text" >
					
	</readPage>

</template>

<script setup lang="ts">
	import { ref,getCurrentInstance} from 'vue';
	import { book_item_data, chapter_item_data } from '../../data/data';
	import { tools } from '../../framework/tools';
	import { UserStatus } from '../../stores/userStatusManager';
	import { log } from '../../framework/log';
	import readPage from '../../components/read/readPage.vue'
	import {onPullDownRefresh,onReachBottom} from '@dcloudio/uni-app'
	const readPages = ref(null)
	let book_data:book_item_data = UserStatus().getUserSlectBook()
	let book_list:chapter_item_data[] = []
	let cur_read_chapter_id =ref(0)
	//设置属性 
	let fontSize = ref(18)
	let lineHeight = ref(1.8)
	let colorList = ref(['#000', '#666']) 
	
	//设置属性end
	if(book_data!=null){
		initView()
	}
	let book_text_list = ref<Array<string>>([])
	function initView(){
		cur_read_chapter_id.value = tools.getChapterReadChapterIdByData(book_data)
		tools.getChapterList(book_data.chapter_path,(chapter_ls)=>{
			// log.Debug("chapter_ls",chapter_ls)
			book_list = chapter_ls
			draw()
		})
	}
	function draw(){
		if(cur_read_chapter_id.value!=0){
			tools.getCurChapterTxt(book_data.base_path,cur_read_chapter_id.value,fontSize.value*2,(text:string)=>{
				book_text_list.value.push(text)
			})
		}
	
	}
	function lower(){
		cur_read_chapter_id.value+=1;
		draw()
	}		
	
	function onClickView(){

	}
	
	function hideAllTop(){
		
	}
	
	function showSetting(){
		
	}
	
	function hideSetting(){
		
	}
	
	onPullDownRefresh( async () => {
		showTopLoadingStatus()
	})
	
	onReachBottom(async ()=>{
		showBottomLoadingStatus()
	})
	
	function showBottomLoadingStatus(){
		readPages.value.find((child,index)=>{
			if( index == (book_text_list.value.length-1) ){
				child.showBottomLoading()
				lower()
			}
		})
	}
	
	function showTopLoadingStatus(){
		readPages.value.find((child,index)=>{
			if( index == 0 ){
				child.showTopLoading()
			}
		})
	}
</script>

<style scoped>
	
</style>