city-gather/src/subPack-common/nickName/index.vue

<script setup lang="ts">
definePage({
  name: 'common-nickName',
  islogin: true,
  style: {
    navigationBarTitleText: '修改昵称',
  },
})
const nickName = ref<string | undefined>('')
const { userInfo } = storeToRefs(useUserStore())
const loading = ref(false)
onLoad(() => {
  nickName.value = userInfo.value.nickName
})
async function handleSubmit() {
  loading.value = true
  await useUserStore().updataUserInfo({ ...userInfo.value, nickName: nickName.value })
  loading.value = false
}
</script>

<template>
  <view class="box-border bg-white p24rpx" :style="{ height: `calc(100vh - var(--window-top))` }">
    <view class="border-2rpx border-#F0F0F0 rounded-16rpx border-solid px24rpx py28rpx">
      <wd-input v-model="nickName" placeholder="请输入昵称" clearable no-border type="nickname" />
    </view>
    <view class="mb28rpx mt20rpx text-28rpx text-#AAAAAA">
      限2-10个汉字
    </view>
    <wd-button block size="large" :loading="loading" @click="handleSubmit">
      确定
    </wd-button>
  </view>
</template>

<style scoped>

</style>