文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

vue3.0vantpopup渲染不出来问题及解决

2023-01-18 12:00

关注

vue3.0 vant popup渲染不出来

遇到这个问下,先检查看看是不是看着vant的2.x版本进行开发。

vant2.x版本代码如下:

<van-popup
  v-model="show"
  closeable
  position="bottom"
  :style="{ height: '30%' }"
/>

vant3.x版本代码如下:

<van-popup
  v-model:show="show"
  round
  position="bottom"
  :style="{ height: '30%' }"
/>

发现 v-model:show=“show”,v-model的时候多了个:show。

开发时还是得注意看插件的版本号是不是支持到vue3.x。

vant 3.x地址:https://vant-contrib.gitee.io/vant/next/#/zh-CN

vue3中组件无法渲染成功

TypeError: Cannot read property ‘avatar‘ of undefined

做项目的时候,通过props传值传了对象到子组件,结果调用的时候一直报错说找不到对象中的某个属性(undefined),但是我通过devtools查看的时候却可以在子组件中查找到这个对象的所有完整属性,说明这个对象已经传到子组件了,对象是没有问题的。

报错情况如下:

找了很久发现是在template中,我在根组件里添加了是否要显示的判断

<div v-if="Object.keys(commentinfo).length != 0" class="comment-info">

但是括号的位置错了,一开始写成了如下的错误方式,所以导致了模版没办法渲染。

<div v-if="Object.keys(commentinfo.length) != 0" class="comment-info">

计算机的报错原因有时候是不准确的,当整个页面都显示不出来的时候,也许可以看看根组件有无问题。

另外,对于自己不太熟悉的属性/写法,应该好好理解再三检查,刚开始接触新东西就是比较容易犯错。

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯