vue3加载界面时如何初始化数据

需求：登录页面有个图片验证码，需要请求后台，得到的结构如下：

1. {
   
2.     "captcha_id":"XRjYnf3NEqmEDARRzGMZ",
   
3.     "captcha_image":"data:image/png;base64,XXXX"
   
4. }

复制代码

封装了一个函数 getLoginCaptcha ()，用于发送请求（axios 方式）。代码如下，网络中查看请求响应都没有问题，那么我该如何获取这个数据并赋值给视图呢？我的代码如下（省略各种 import）：

1. <script lang="ts" setup>
   
2. let captcha_image = ref()
   
3. onMounted(()=>{ //改成onBeforeMount一样有问题，加async await一样不起作用
   
4.   init()
   
5. })
   
6. const init = ()=>{
   
7.   getLoginCaptcha().then(res=>{
   
8.   console.log(res)// 此处打印为undefined
   
9.   captcha_image.value=res
   
10.   }).catch(err=>{
    
11.     console.log(err)
    
12.   })
    
13. }
    
14. </script>
    
15. 
    
16. ————————————————
    
17. 原文作者：meitian
    
18. 转自链接：https://learnku.com/f2e/t/67513
    
19. 版权声明：著作权归作者所有。商业转载请联系作者获得授权，非商业转载请保留以上作者信息和原文链接。

复制代码