提交

pages/mine/aboutUs/setFontSize.vue

@@ -0,0 +1,85 @@
+<template>
+  <page-meta
+    :page-font-size="fontValue + 'px'"
+    :root-font-size="fontValue + 'px'"
+  ></page-meta>
+  <view>
+    <public-module></public-module>
+    <z-nav-bar title="关于我们" bgColor="#3AB3AE" fontColor="#fff"></z-nav-bar>
+    <view class="content">
+      <view>
+        <view class="fontchange">文字大小</view>
+      </view>
+      <view style="width: 100%; padding: 0 10px">
+        <slider
+          :min="2.5"
+          :max="4"
+          :value="fontValue"
+          @change="sliderChange"
+          :step="1"
+        />
+        <view class="change-fontsize-box">
+          <text style="font-size: 10px"> 最小 </text>
+          <text style="font-size: 12px"> 标准 </text>
+          <text style="font-size: 14px"> 最大 </text>
+        </view>
+      </view>
+      <view style="padding: 20px 10px; width: 100%">
+        <u-button type="primary" @click="submit">确定</u-button>
+      </view>
+    </view>
+  </view>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      fontValue: 3,
+    };
+  },
+  onShow() {
+    uni.getStorageSync("fontSize")
+      ? (this.fontValue =this.$baseFontSize())
+      : (this.fontValue = 3);
+  },
+
+  methods: {
+    sliderChange(e) {
+      this.fontValue = e.detail.value;
+    },
+    submit() {
+      uni.setStorageSync("fontSize", this.fontValue);
+      uni.showToast({
+        title: "设置成功",
+        icon: "none",
+        duration: 1500,
+      });
+      console.log(uni.getStorageSync("fontSize"));
+      uni.navigateBack({
+					delta: 1
+				});
+    },
+  },
+};
+</script>
+<style>
+.fontchange {
+  font-size: 26rpx;
+  margin: 20px 0;
+}
+.content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  padding: 5px;
+  box-sizing: border-box;
+}
+.change-fontsize-box {
+  margin: 10px 18px;
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+}
+</style>