Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[cascader] options异步加载较长时间时,v-model的值会被重置为空 #1010

Closed
joykk opened this issue Jun 15, 2022 · 5 comments
Closed
Assignees
Labels
🐞 bug Something isn't working

Comments

@joykk
Copy link

joykk commented Jun 15, 2022

tdesign-vue 版本

^0.40.3

重现链接

No response

重现步骤

selectedValue:{{ selectedValue }}

xxxxxxxxxx

<script> import { ListProductCascader } from '@/api/vue-api-client'

export default {
props: {
multiple: {
required: false,
default: function() {
return false
},
type: Boolean
},
filterable: {
default: function() {
return true
},
type: Boolean
},
placeholder: {
default: function() {
return '请选择产品,如无子产品选择请选择“缺省”'
},
type: String
},
value: {
required: true,
default: function() {
return ''
},
type: String
}
},
data: function() {
console.log(this.value)
return {
selectedValue: this.value,
options: []
}
},
created() {
this.handleLoadOption()
// this.load()
},
methods: {
load() {
return new Promise((resolve) => {
setTimeout(() => {
// 在这里设置超时之后可以100%自动选上
this.selectedValue = this.value
console.log(this.selectedValue)
}, 10000)
})
},
onChange(val) {
this.$emit('input', val)
},
handleLoadOption() {
// 耗时较长
ListProductCascader().then(response => {
if (response.code_str !== 'Ok') {
this.$notify.error({ title: '错误', message: response.error_info })
return
}
this.options = response.data
console.log(this.selectedValue.length)
if (this.selectedValue.length === 0) {
this.selectedValue = this.value
}
console.log(this.selectedValue)
}).catch(error => {
console.log(error)
})
}
}
}
</script>

<style scoped> .t-demo-cascader-title { margin: 10px 0; } .t-demo-cascader + .t-demo-cascader { margin-top: 16px; } </style>

期望结果

插件可以自动选择上

实际结果

插件不会自动选择

框架版本

No response

浏览器版本

No response

系统版本

No response

Node版本

v16.15.0
vue 2.6.14

补充说明

No response

@github-actions
Copy link
Contributor

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

@github-actions
Copy link
Contributor

github-actions bot commented Jun 15, 2022

♥️ 有劳 @ummo @PengYYYYY 尽快确认问题。
确认有效后将下一步计划和可能需要的时间回复给 @joykk

@PengYYYYY PengYYYYY added to be published fixed, not be published and removed to be published fixed, not be published labels Jun 26, 2022
@cong-min
Copy link
Contributor

cong-min commented Jul 18, 2022

补充一下示例:https://stackblitz.com/edit/angular-2s22do?file=src%2Fdemo.vue

希望能尽快解决 @ummo @PengYYYYY

@ldc4
Copy link

ldc4 commented Jul 19, 2022

setValue(multiple ? [] : '', 'invalid-value');

这里在异步options场景下,回显有问题,是否在找不到option的情况下,也默认保留value值即可?
image

@cong-min cong-min added the 🐞 bug Something isn't working label Aug 2, 2022
@PengYYYYY
Copy link
Collaborator

#1228 已修复

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🐞 bug Something isn't working
Projects
None yet
Development

No branches or pull requests

4 participants