init

miniprogram/pages/index/index.ts

 // index.ts
 // 获取应用实例
-import { storeBindingsBehavior } from "mobx-miniprogram-bindings";
+import { ComponentWithStore } from "mobx-miniprogram-bindings";
 import { store } from "../../store/store";
 
 const app = getApp<IAppOption>()
 const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'
 
-Page({
-    behaviors: [storeBindingsBehavior],
+ComponentWithStore({
     storeBindings: {
         store,
         fields: {
@@ -18,7 +17,6 @@ Page({
         },
     },
     data: {
-        motto: 'Hello World',
         userInfo: {
             avatarUrl: defaultAvatarUrl,
             nickName: '',
@@ -27,42 +25,46 @@ Page({
         canIUseGetUserProfile: wx.canIUse('getUserProfile'),
         canIUseNicknameComp: wx.canIUse('input.type.nickname'),
     },
-    // 事件处理函数
-    bindViewTap() {
-        wx.navigateTo({
-            url: '../logs/logs',
-        })
-    },
-    changeStore() {
-        store.updateHomeInfo();
-    },
-    onChooseAvatar(e: any) {
-        const {avatarUrl} = e.detail
-        const {nickName} = this.data.userInfo
-        this.setData({
-            "userInfo.avatarUrl": avatarUrl,
-            hasUserInfo: nickName && avatarUrl && avatarUrl !== defaultAvatarUrl,
-        })
-    },
-    onInputChange(e: any) {
-        const nickName = e.detail.value
-        const {avatarUrl} = this.data.userInfo
-        this.setData({
-            "userInfo.nickName": nickName,
-            hasUserInfo: nickName && avatarUrl && avatarUrl !== defaultAvatarUrl,
-        })
-    },
-    getUserProfile() {
-        // 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认，开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
-        wx.getUserProfile({
-            desc: '展示用户信息', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
-            success: (res) => {
-                console.log(res)
-                this.setData({
-                    userInfo: res.userInfo,
-                    hasUserInfo: true
-                })
-            }
-        })
+
+    methods:{
+        // 事件处理函数
+        bindViewTap() {
+            wx.navigateTo({
+                url: '../logs/logs',
+            })
+        },
+        changeStore() {
+            store.updateHomeInfo();
+        },
+        onChooseAvatar(e: any) {
+            const {avatarUrl} = e.detail
+            const {nickName} = this.data.userInfo
+            this.setData({
+                "userInfo.avatarUrl": avatarUrl,
+                hasUserInfo: nickName && avatarUrl && avatarUrl !== defaultAvatarUrl,
+            })
+        },
+        onInputChange(e: any) {
+            const nickName = e.detail.value
+            const {avatarUrl} = this.data.userInfo
+            this.setData({
+                "userInfo.nickName": nickName,
+                hasUserInfo: nickName && avatarUrl && avatarUrl !== defaultAvatarUrl,
+            })
+        },
+        getUserProfile() {
+            // 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认，开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
+            wx.getUserProfile({
+                desc: '展示用户信息', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
+                success: (res) => {
+                    console.log(res)
+                    this.setData({
+                        userInfo: res.userInfo,
+                        hasUserInfo: true
+                    })
+                }
+            })
+        },
     },
+
 })