new Proxy 监听对象 在模板中属性名被修改为 __v_isRef

ts

function getSizeIndex() {  
    let sizesIndex = uni.getStorageSync(storageKeys.fontIndex)  
    // 还未设置过字体大小  
    if (sizesIndex === '') {  
        uni.setStorageSync(storageKeys.fontIndex, 1)  
        sizesIndex = 1  
    }  

    return sizesIndex  
}  

/**  
* 获取文字字号  
*/  
const size = {  
    get() {  
        const index: string = getSizeIndex()  
        const res = rootFont.sizes[index]  
        return res  
    },  

    font: '32rpx',  

    set() { },  
}  
export const fontSize = new Proxy(size, {  
    get(obj, prop) {  
        console.log(obj, 'obj');  
        console.log(prop, 'prop');  

        return obj[prop]()  
    }  
})

html

<template>  
  <page-meta :root-font-size="fontSize.get">  
    <view class="home-container">  
      <!-- 上 -->  
      <div class="top">  
        <!-- 轮播图 -->  
        <div class="banner-swiper-box">  
          <BannerSwiper height="246rpx" :images="images" />  
        </div>  

        <!-- 选项 -->  
        <CustomButton type="primary" @tap="utils.naviTo(source.pages.feedback)">意见反馈</CustomButton>  
        <!-- <Que /> -->  
        <!-- 提示 -->  
      </div>  

      <!-- 下 -->  
      <div class="bottom"></div>  
    </view>  
  </page-meta>  
</template>  

<script setup lang="ts">;  

import { reactive, ref, toRefs } from 'vue';  
// 组件  
import BannerSwiper from '@c/BannerSwiper'  
import CustomButton from '@c/CustomButton'  

// 资源  
import * as source from '@/source'  

// 工具  
import * as utils from '@/utils'  

// 配置  
import { fontSize } from '@/config'