资讯专栏INFORMATION COLUMN

Dcloud,hbuilderX开发uni-app第一天踩坑记录

zqhxuyuan / 3145人阅读

摘要:其实大部分坑在在官网都有介绍具体位置在在中使用模块官方文档中总结了很多坑,但我只说一下我今天遇到的坑不支持中的过滤器解决办法从后台获取数据后始用对数据进行处理,例子始用过滤器时始用仅为示例,并非真实接口地址。

其实大部分坑在 uni-app在官网都有介绍 具体位置在 在 uni-app 中使用 Vue.js 模块

官方文档中总结了很多坑,但我只说一下我今天遇到的:

坑1:uni-app不支持vue中的过滤器

解决办法:从后台获取数据后始用js对数据进行处理,
例子:

始用过滤器时:

{{talk.date|formatTime}}

始用uni-app:

uni.request({
        url: "http://localhost:8088/talk/queryList", //仅为示例,并非真实接口地址。
        success: (res) => {
            this.talkList = res.data
            this.talkList.forEach(item => item.date = this.formatTime(item.date))
        }
    })
坑2: uni-app中vuex使用的区别

uni-app中this.$store为undefind ,必须要在main.js中加入这行代码

Vue.prototype.$store = store

详细配置可点击标题连接,uni-app官网有详细说明,与普通vue项目不同的只是多了上面这行代码

坑3:微信不支持本地字体图标

之前我的iconfont.css是从 阿里巴巴矢量图标库 下载到本地的,但是uni-app不支持本地iconfont.css,报错

00:42:22.580 Module build failed: ModuleNotFoundError: Module not found: Error: Can"t resolve "./iconfont.eot?t=1521557349802" in "D:workspaceappProjectsuniQingchipagesindex"
00:42:22.592     at factoryCallback (D:appHBuilderXpluginsuniapp
ode_moduleswebpacklibCompilation.js:264:39)
00:42:22.592     at factory (D:appHBuilderXpluginsuniapp
ode_moduleswebpacklibNormalModuleFactory.js:247:20)
00:42:22.603     at resolver (D:appHBuilderXpluginsuniapp
ode_moduleswebpacklibNormalModuleFactory.js:65:21)
00:42:22.613     at asyncLib.parallel (D:appHBuilderXpluginsuniapp
ode_moduleswebpacklibNormalModuleFactory.js:138:21)

后来看了官网知道了微信小程序不支持本地图标,

解决方案:从阿里巴巴矢量图标库 获取在线连接

可以点击Unicode旁边的Font class然后点开里面的网址,将展示的内容替换本地的css就好了

坑4:普通vue项目代码粘过来改动很大,不支持html原生标签,类似微信小程序

而且目前uni-app 标签很少,组件也很少, uni-app中的view标签相当于html中的div或者p标签,text标签相当于p标签,
我今天只用了三个标签 button,view,image
贴一个官方的代码你们自己感受一下 全是一色的view标签:

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/97077.html

相关文章

  • 初探uni-app框架 踩坑

    摘要:近些天有接触到框架,使用软件进行编译,能生成多端项目文件,如微信百度支付宝小程序及和端,记录遇到的问题条件编译我觉得比较突出的一点功能,就是这个条件编译,指定对应的代码执行在对应的一端仅在某平台存在除了某平台均存在如只在微信小程序中才执行 近些天有接触到uni-app框架,使用HBuilderX软件进行编译,能生成多端项目文件,如微信、百度、支付宝小程序及Android和ios端,记录...

    neu 评论0 收藏0
  • uni-app实现Android分享到微信朋友圈和微信好友,附DEMO和源码

    摘要:微信分享大家见怪不怪了就是再点击分享,然后唤起微信,分享当前页面到朋友圈或者分享给朋友。点击配置,进去找到分享,填写和和在哪弄这是需要前往微信开放平台申请的进去注册一个帐号,登录,创建移动应用。 微信分享大家见怪不怪了!就是再APP点击分享,然后唤起微信,分享当前页面到朋友圈或者分享给朋友。 所以,我开发了这样的一个工具。 showImg(https://segmentfault.co...

    fox_soyoung 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<