[t-input] nickname类型无法获取用户微信昵称

[BaYunmo-Lry]

tdesign-miniprogram 版本

v1.5.1

重现链接

No response

重现步骤

<t-input value="{{name}}" bind:change="onChangeName" bind:blur="onBlurName" label="姓名" placeholder="请输入姓名或昵称" bind:nicknamereview="onNicknamereview" type="nickname" clearable></t-input>
以上代码在用户选择微信昵称后并没有触发change事件，blur事件触发但value值仍然是空的，可以触发nicknamereview但该事件并没有我需要的数据，最终导致我无法获取用户的微信昵称

期望结果

用户选择微信昵称后，能够像微信原生组件input一样触发change事件，并返回相应的value值

实际结果

No response

基础库版本

3.5.6

补充说明

微信原生组件input并没有这种问题，在选择完就会立刻触发change事件并在detail.value中返回微信昵称

[github-actions]

👋 @BaYunmo-Lry，感谢给 TDesign 提出了 issue。
请根据 issue 模版确保背景信息的完善，我们将调查并尽快回复你。

[anlyyao]

@BaYunmo-Lry 没有复现出你的问题，我这边在代码片段上看两边表现是一致的，https://developers.weixin.qq.com/s/FHvmtcm271UA。 你可以先试下代码片段，或者在此代码片段上重新复现你的问题，我们会持续关注

[Locter9001]

你好，我这里有一些能复现问题的代码片段，但我并没有使用change，而是直接使用form表单，在以前版本中测试没有问题

WXML:

<view class="userinfo">
	<view class="avatar-group">
		<button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar">
			<image class="avatar" src="{{ avatar }}"></image>
		</button>
		<view>头像</view>
	</view>

	<form catchsubmit="formSubmit" catchreset="formReset">
		<t-input
			autosize
			layout="vertical"
			label="用户名称"
			name="nick_name"
			placeholder="请输入"
			maxlength="10"
			type="nickname"
			model:value="{{ nick_name }}"
			disableDefaultPadding="{{true}}"
			indicator
		/>

		<view class="form-button">
			<t-button theme="primary" block size="large" type="submit" style="margin-left: 10rpx">提交</t-button>
		</view>
	</form>
</view>

*.ts

// pages/my/userinfo/index.ts
import { RequestError } from '@/service/index'
import user from '@/service/user'
import UploadFile from '@/utils/Uploader'
import dayjs from 'dayjs'

// pages/workbench/workorder/add/index.ts
interface IWorkOrderAddData {
	avatar: string
	nick_name: string
	userinfo?: AppModel.UserInfo
}

Page<IWorkOrderAddData, WechatMiniprogram.Page.CustomOption>({
	/**
	 * 页面的初始数据
	 */
	data: {
		avatar: '',
		nick_name: ''
	},

	onChooseAvatar(e: any) {
		console.debug(this.data)
		const { avatarUrl } = e.detail
		this.setData({
			avatar: avatarUrl
		})
	},

	async formSubmit(e: WechatMiniprogram.CustomEvent<{ value: AppModel.UpdateUserInfo }>) {
		console.log('form发生了submit事件，携带数据为：', e.detail.value)

		wx.showLoading({
			title: '正在提交',
			mask: true
		})

		try {
			let url = this.data.avatar

			// 匹配 http://tmp/ 开头，如果是说明本地文件，需要上传
			if (url.startsWith('http://tmp/') || url.startsWith('wxfile://')) {
				url = await UploadFile(this.data.avatar, `${dayjs().format('YYYY-MM-DD')}/`)
			}

			await user.update({
				avatar: url,
				nick_name: e.detail.value.nick_name
			})

			wx.showToast({
				title: '信息更新成功',
				icon: 'success',
				duration: 500
			})

			const userinfo = await user.userinfo()
			wx.setStorageSync('userinfo', userinfo)
			wx.navigateBack()
		} catch (e) {
			console.warn('信息更新失败', e)
			if (e instanceof RequestError) {
				wx.showToast({
					title: e.message,
					icon: 'none'
				})
			} else {
				wx.showToast({
					title: '服务器繁忙',
					icon: 'none'
				})
			}
		}
	},
})

在使用微信昵称后通过开发者工具观察AppData也发现并没有自动给 nick_name 赋值。

[anlyyao]

你好，我这里有一些能复现问题的代码片段，但我并没有使用change，而是直接使用form表单，在以前版本中测试没有问题

WXML:

<view class="userinfo">
	<view class="avatar-group">
		<button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar">
			<image class="avatar" src="{{ avatar }}"></image>
		</button>
		<view>头像</view>
	</view>

	<form catchsubmit="formSubmit" catchreset="formReset">
		<t-input
			autosize
			layout="vertical"
			label="用户名称"
			name="nick_name"
			placeholder="请输入"
			maxlength="10"
			type="nickname"
			model:value="{{ nick_name }}"
			disableDefaultPadding="{{true}}"
			indicator
		/>

		<view class="form-button">
			<t-button theme="primary" block size="large" type="submit" style="margin-left: 10rpx">提交</t-button>
		</view>
	</form>
</view>

*.ts

// pages/my/userinfo/index.ts
import { RequestError } from '@/service/index'
import user from '@/service/user'
import UploadFile from '@/utils/Uploader'
import dayjs from 'dayjs'

// pages/workbench/workorder/add/index.ts
interface IWorkOrderAddData {
	avatar: string
	nick_name: string
	userinfo?: AppModel.UserInfo
}

Page<IWorkOrderAddData, WechatMiniprogram.Page.CustomOption>({
	/**
	 * 页面的初始数据
	 */
	data: {
		avatar: '',
		nick_name: ''
	},

	onChooseAvatar(e: any) {
		console.debug(this.data)
		const { avatarUrl } = e.detail
		this.setData({
			avatar: avatarUrl
		})
	},

	async formSubmit(e: WechatMiniprogram.CustomEvent<{ value: AppModel.UpdateUserInfo }>) {
		console.log('form发生了submit事件，携带数据为：', e.detail.value)

		wx.showLoading({
			title: '正在提交',
			mask: true
		})

		try {
			let url = this.data.avatar

			// 匹配 http://tmp/ 开头，如果是说明本地文件，需要上传
			if (url.startsWith('http://tmp/') || url.startsWith('wxfile://')) {
				url = await UploadFile(this.data.avatar, `${dayjs().format('YYYY-MM-DD')}/`)
			}

			await user.update({
				avatar: url,
				nick_name: e.detail.value.nick_name
			})

			wx.showToast({
				title: '信息更新成功',
				icon: 'success',
				duration: 500
			})

			const userinfo = await user.userinfo()
			wx.setStorageSync('userinfo', userinfo)
			wx.navigateBack()
		} catch (e) {
			console.warn('信息更新失败', e)
			if (e instanceof RequestError) {
				wx.showToast({
					title: e.message,
					icon: 'none'
				})
			} else {
				wx.showToast({
					title: '服务器繁忙',
					icon: 'none'
				})
			}
		}
	},
})

在使用微信昵称后通过开发者工具观察AppData也发现并没有自动给 nick_name 赋值。

还是没提供是从哪个版本升级到的1.5.1哇？"在以前版本中测试没有问题" 以前的版本指的是哪个版本？

[Locter9001]

还是没提供是从哪个版本升级到的1.5.1哇？"在以前版本中测试没有问题" 以前的版本指的是哪个版本？

你好，我检查了一下我的历史提交记录，发现没有更新，虽说我之前好几次都用过 yarn upgrade 命令，但貌似最新版就是1.4.4。不过以前的版本的确是可以获取到的，是经过测试后才上传了体验版，我再排查一下是不是基础库升级或是其他问题，您可以拿代码示例测一下呢，目前就是拿不到信息。

[Locter9001]

@anlyyao 貌似是从 1.4.4 升级到 1.6.0 之后的问题，只是很奇怪为什么这里的版本不一致，1.6.0 是我现在的主推分支里面的代码