uniIM/pages/mine/fontSizeSetting.vue

<template>
	<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
  <view>
    <cu-custom bgImage="/static/bg.png" :isBack="true">
      <template v-slot:content>
        <text class="text-black">字体设置</text>
      </template>
    </cu-custom>
    <view class="contentIncolumnC" style="margin-top: 40rpx;">
		<view style="width: 80%;">
			<slider :value="fontValue" @change="sliderChange" min="10" max="30"/>
		</view>
		<view class="contentInRowS" style="width: 80%;margin-top: 10px;">
			<text @click="setfontsize(10)">最小</text>
			<text @click="setfontsize(20)">标准</text>
			<text @click="setfontsize(30)">最大</text>
		</view>
		<view class="text-center" style="width: 80%;margin-top: 80rpx;">
		  <button class="cu-btn bg-zblue border lg" style="width: 100%;" @tap="submit">保存</button>
		</view>
		
    </view>
  </view>
</template>

<script setup lang="ts">
import CuCustom from '@/colorui/components/cu-custom.vue'
import MessageUtils from "@/utils/MessageUtils";
import {onLoad} from '@dcloudio/uni-app'
import {ref} from "vue";
import Auth from "@/api/Auth";
const fontValue=ref(Auth.getfontSize());

onLoad(() =>{
	fontValue.value=Auth.getfontSize();
})


const sliderChange=(e:any)=>{
	console.log(e.detail.value);
	fontValue.value=e.detail.value;
}

const submit=(e)=>{
	Auth.setfontSize(fontValue.value);
	MessageUtils.success('保存成功');
}

const setfontsize=(size:number)=>{
	fontValue.value=size;
}

</script>

<style scoped>
@import url('@/static/css/main.css');

</style>