举例：

我在cursor上输入使用uni-app搭建一个博客，可以部署至H5，安卓，小程序。 博客包含首页和文章详情页及我的。 带登陆和查询功能。 于是执行之后效果如下。

一个完整的博客项目就这样完成了。 你可以针对具体的页面进行描述你想要的效果，也可以上传UI图来让AI根据AI图输出， 即使有些改动，工作量也很小。 可以说基本上完全淘汰掉了那些重复性没有难度的活.

减少工作量是一点，还一点是它可以让你去往你之前不曾涉足的领域， 比如作为web开发，你没接触过应用开发并且想了解下flutter开发。 你可以使用它搭建helloworld =》 博客 =》 大型应用。而你可以根据项目来逐步了解。 

     所以引用类型拷贝需要将属性进行递归遍历，直至属性为基础类型时进行拷贝。 否则就是浅拷贝，浅拷贝时修改新对象的值会同时修改到旧对象的值。 

     综上所述，浅拷贝很简单，直接{...oldObj}。 或者 Object.assign({}, oldObj) 等方法即可。而深拷贝则需要递归属性进行判断。 (有个简便方法，即JSON.stringify()。 此方法将对象转为了字符串进行赋值，所以也能实现深拷贝。但是转为字符串时 function ，undefined的属性会丢失)

1、为基础类型，直接进行赋值操作。

2、为对象，进行递归调用判断

3、为数组，如果数组中为基础类型，使用slice生成一个新对象，或者解构运算符[...arr]。 如果数组含有引用类型则需要遍历属性至基础类型进行操作。

4、 为set， 直接new Set ([..oldSet])即可。

5、 为set， 直接new Map([..oldMap])即可。

6、为symbol， 为symbol 进行1的操作即可。前提是访问到symbol，可以使用Object.getOwnPropertySymbols()访问对象的symbol。然后遍历赋值给克隆对象

7、函数，可以考虑转成字符串之后进行处理

8 、其他等等 可以根据实际需求进行扩展相应方法。   

示例代码如下：  

const cloneBase = (newData, oldValue, key) => {
 newData[key] = oldValue;
}
cont cloneArr = (newData, oldValue, key) => {
 // 这里假定数组内部只有基础类型
 newData[key] =oldValue.slice(0);
}
const cloneSet = (newData, oldValue, key) => {
 newData[key] = new Set([...oldValue]);
}
const cloneMap = (newData, oldValue, key) => {
 newData[key] = new Map([...oldValue]);
}
// 其他依次按照步骤写相应的方法

function deepCopy(data) => {
 if (typeof !== "object") {
  // 如果为基础类型则直接返回基础类型、这里没有处理symbol
  return data;
 }
 let new Data = {};
 Object.keys(data).forEach(key => {
   const curr = data[key];
  // 如果为基础类型
  if (typeof curr !== "object") {
    cloneBase(newData, curr, key);
   }
  // 其他依次调用判断方法即可，最后如果处理对对象进行递归调用处理
  else {
   newData[key] = deepCopy(curr);
  }
 });
  return new Data();
 }

 1. app.scss

/* 自定义字体 */
@font-face {
  font-family: 'D-DIN';
  src: url("https://speedship-prod.oss-cn-shenzhen.aliyuncs.com/wechat_fonts/D-DIN.otf");
}
@font-face {
  font-family: 'D-DIN-Bold';
  src: url("https://speedship-prod.oss-cn-shenzhen.aliyuncs.com/wechat_fonts/D-DIN-Bold.otf");
}

 2. 引用界面

.classname {
 font-family: D-DIN-Bold
}

二、app里面使用loadFace

wx.loadFontFace({
  family: 'Bitstream Vera Serif Bold',
  source: 'url("https://sungd.github.io/Pacifico.ttf")',
  success: console.log
})

一、app.vue

globalData: {
      navBarHeight: 0, // 导航栏高度
      statusBarHeight: 0 // 状态高度
}, // 全局变量

onLaunch: function() {
  console.log("App Launch");
  let self = this;
  // 计算动态高度
  uni.getSystemInfo({
  success: function(e) {
     // navigationbar高度等于状态栏高度加自定义导航部分高度
     // 状态栏高度是e.statusBarHeight
    //导航栏部分高度有的方案是根据胶囊的边距再加胶囊的高度
    // 有的说状态栏高度加44px，(有的说安卓和ios 分别是44 和 48 )
          const navBarHeight = e.statusBarHeight + 44;
          self.globalData.navBarHeight = navBarHeight;
          self.globalData.statusBarHeight = e.statusBarHeight;
          uni.setStorageSync('statusBarHeight', navBarHeight);
         uni.setStorageSync('statusBarHeight', navBarHeight);
  }
})

二、navigationBar

<template>
  <view class="navigation-bar-wrapper" :style="{height: navBarHeight + 'px', paddingTop: statusBarHeight + 'px'}">
    <view class="_back-btn" @tap="back"></view>
    <slot></slot>
  </view>
</template>

<script>
var app = getApp();
export default {
  name: "uni-navigation-bar",
  data() {
    return {
      navBarHeight: app.globalData.navBarHeight,
      statusBarHeight: app.globalData.statusBarHeight,
    }
  },
  methods: {
    back() {
      this.$emit('back');
    }
  }
}
</script>

三、引用地方

<uniNavigationBar @back="onBack">
      <view class="nav-bar-wrapper">
        这里是导航栏
      </view>
    </uniNavigationBar>

1. 学习， 列了完整的学习清单，但是学了几天就没动静了。

2. 运动，坚持了一周夭折。

3. 游戏，打卡了几天就AFK。

回顾了一下，唯一坚持了一段时间的也就是最近的一个游戏了，坚持下去的原因竟然是因为找到了固定队，每天队友催着上线。 就离谱。曾经有好多的机会，都因为自己能力不足导致放弃了。 

I18n

/**
 * 多语言配置文件
 */
import I18n from "i18n-js";
// import * as RNLocalize from "react-native-localize";
import cn from './lang/cn';
import en from './lang/en';
import th from './lang/th';
import store from '../store/store';
import Map from "../config/Map";

// const locales = RNLocalize.getLocales();
// const systemLanguage = locales[0]?.languageCode;  // 用户系统偏好语言
const userLanguageSetting = store.getState().publicStore.userLanguageSetting;  // 用户手动设置语言
I18n.locale = userLanguageSetting;
// if (userLanguageSetting) {
//     I18n.locale = userLanguageSetting;
// } else if (systemLanguage && Map.LANG_SETTING.includes(systemLanguage)) {
//     I18n.locale = systemLanguage;
// } else {
//     I18n.locale = 'en';  // 用户既没有设置，也没有获取到系统语言时，默认加载英语语言资源
// }

// 监听应用运行过程中语言的变化
store.subscribe(() => {
    const newUserLanguageSetting = store.getState().publicStore.userLanguageSetting;
    console.log('.....newUserLanguageSetting....', newUserLanguageSetting);
    console.log('.....userLanguageSetting....', I18n.locale);
    if (newUserLanguageSetting && newUserLanguageSetting !== I18n.locale) {
        I18n.locale = newUserLanguageSetting;
    }
});

I18n.fallbacks = true;
I18n.translations = {
    zh: cn,
    en,
    th,
};

export default I18n;
// export { systemLanguage };

setLanguage.js 

/**
 * 设置语言界面
 */
import React from 'react';
import { View, Text, TouchableOpacity, StyleSheet } from 'react-native';
import { connect } from 'react-redux';
import {setLanguage} from "../store/publicStore/action";

class SetLanguage extends React.Component {
    constructor(props) {
        super(props);
    }
    render(): React.ReactNode {
        return (
            <View>
                <TouchableOpacity onPress={() => {
                    this.props.setLanguage('en');
                }}>
                    <Text>英文</Text>
                </TouchableOpacity>
                <TouchableOpacity onPress={() => {
                    this.props.setLanguage('zh');
                }}>
                    <Text>中文</Text>
                </TouchableOpacity>
                <TouchableOpacity onPress={() => {
                    this.props.setLanguage('th');
                }}>
                    <Text>泰文</Text>
                </TouchableOpacity>
            </View>
        );
    }
}
const mapStateToProps = state => ({
    userLanguageSetting: state.publicStore.userLanguageSetting
});
const mapDispatchToProps = dispatch => ({
    setLanguage: lang => dispatch(setLanguage(lang))
});
export default connect(mapStateToProps, mapDispatchToProps)(SetLanguage);

languageUpdate.js

import React, { useState, useEffect } from 'react';
import {View} from "react-native";
import store from '../store/store';
import I18n from './index';

const UseLanguageUpdate = ({onLanguageChangeCallBack, listenParamArr = []}) => {
    const [currentLanguageCode, setCurrentLanguageCode] = useState( I18n.locale);

    useEffect(() => {
        return store.subscribe(() => {
            const newUserLanguageSetting = store.getState().publicStore.userLanguageSetting;
            console.log('newUserLanguageSetting....', newUserLanguageSetting);
            console.log('currentLanguageCode....', currentLanguageCode);
            if (newUserLanguageSetting && newUserLanguageSetting !== currentLanguageCode) {
                setCurrentLanguageCode(newUserLanguageSetting);
                if (onLanguageChangeCallBack) onLanguageChangeCallBack();
            }
        });
    }, [currentLanguageCode, ...listenParamArr]);
    return (
        <View />
    )
};
export default UseLanguageUpdate;

}

宽高使用scaleSize进行转换，如<view style={{width: scaleSize(100)}}></view>。字体使用setSpText转换， 如<Text style={{fontSize: setSpText(12)}}>文本</Text>

1. 引入微信官方的自定义菜单 https://developers.weixin.qq.com/miniprogram/dev/framework/ability/custom-tabbar.html  这是官网地址，下载的官方demo放在根目录下

2. app.js种定义全局的tab变量。并且在生命周期中根据逻辑判断赋值

3. 在自定义tabbar的js中生命周期里面重新设置tab

4. 由于小程序底部tabbar为fixed布局。所以需要设置一个全局padding-bottom为自定义tabbar高度的全局样式，在所有有tabbar的页面最外层标签上都加上此样式，这样才不会导致页面被tabbar遮挡