在函数里赋值给reactive申明的响应式参数,能够在赋值的下一行打印出来,但是在template中取不到
Version
3.0.11
Reproduction link
Steps to reproduce
1、用script导入高德的jsapi 2、获取高德map对象 3、使用高德的搜索插件,搜索完毕赋值,可打印,但是在template不可使用 4、不知是我没有使用正确,还是vue3的bug
使用的antdv2 template:
<a-select style="width:100%"
placeholder="请输入你要检索的地点"
show-search
@search="searchPalace"
>
<a-select-option v-for="palace in palaces" :value="palace.name">
{{ palace.name }}
</a-select-option>
</a-select>
<div id="container" style="height:300px;width:300px"></div>
js:
setup(){
const AMap = undefined
const map = undefined
const data = reactive({
palaces: [],
})
onMounted(() => {
// 这是使用js实例化一次高德的代码,用高德官网自带的方式也是一样的
MapLoader().then(AM => {
AMap = AM
map = new AM.Map('container')
})
})
const searchPalace = (keyword) => {
AMap.plugin('AMap.PlaceSearch', function () {
const autoOptions = {
city: '长沙市'
}
const placeSearch = new AMap.PlaceSearch(autoOptions);
setTimeout(() => {
data.places = [{name: '测试异步'}, {name: '测试'}]
console.log(data.places)
}, 0)
// placeSearch.search(keyword, function (status, result) {
// if (result.info === "OK") {
// data.places = result.poiList
// console.log(data.places)
// }
// })
})
}
return {
...toRefs(data),
searchPalace
}
}
What is expected?
显示下拉框的地区列表
What is actually happening?
在函数里赋值给reactive申明的响应式参数,能够在赋值的下一行打印出来,但是在template中取不到
Hi, thanks for your interest but Github issues are for bug reports and feature requests only. You can ask questions on the forum, the Discord server or StackOverflow.