资讯专栏INFORMATION COLUMN

小程序开发注意事项

geekzhou / 1010人阅读

摘要:在小程序开发中,遇到的一些小坑。在小程序的文件中的里面,不支持复杂的表达式,目前支持简单的三元运算算数运算逻辑判断字符串运算数据路径运算。是小程序的一套脚本语言,可以结合,一起构建页面。不能调用小程序提供的接口。不能作为组件的事件回调。

在小程序开发中,遇到的一些小坑。

1. 轮番图 swiper
autoplay="false" 不会生效,依然会轮番。因为他会把false当作字符串处理  

解决方法是:
(1) autoplay="{{false}}"直接这么写,就可以当作boolean值来处理了。
(2) 
在js中定义:
autoplay: false,
2. 给组件加背景图
官方回答:背景图片不支持本地路径的图片。
https://developers.weixin.qq.com/community/develop/doc/00066ee652084027fb37cca3c51c00?highLine=%25E8%2583%258C%25E6%2599%25AF%25E5%259B%25BE%25E7%2589%2587
本地资源无法通过 WXSS 获取,background-image:可以使用网络图片,或者 base64,或者使用标签。但是不能使用本地图片。

3. textarea标签的默认值设置无效


我们把value设置为任意值,是不能改变输入框的值的。方法是

就可以设置textarea组件的默认值为空。

4. wxs

======

在小程序的WXML文件中的{{}}里面,不支持复杂的表达式,目前支持简单的三元运算、算数运算、逻辑判断、字符串运算、数据路径运算。如果我们页面中要计算 "9, 7".indexOf("3") < 0 等类似的简单方法,之间{{"9, 7".indexOf("3") < 0}} 肯定是不被支持的。所以我们就用到了WXS。

WXS是小程序的一套脚本语言,可以结合WXML,一起构建页面。

WXS与JavaScript是不同的语言,有自己的语法。
WXS不能调用其他JavaScript文件中的函数。
WXS不能调用小程序提供的接口API。
WXS不能作为组件的事件回调。

用法:
(1)直接在WXML文件中写,例如


        var msg = "hello world";
        module.exports.message = msg;
  

   {{m1.message}} 

(2)多带带写在.wxs文件中

     /pages/comm.wxs
        var foo = ""hello world" from comm.wxs";
        var bar = function(d) {
          return d;
        }
        module.exports = {
          FOO: foo,
          bar: bar
        };
    
    在用到的WXML文件中引入


        
         {{tools.bar(tools.FOO)}} 
        
        
5.改变swiper组件,点的位置
    /* 改变swiper中三个点的位置 */
    .swiper .wx-swiper-dots {
      display: block;
      height: 100rpx;
      position: absolute;
      left: 650rpx;
      bottom: 60rpx;
    }

写了一个swiper,效果如下,如果有人需要可以自己去git上下载。
地址 https://github.com/DaYuXiaoZh...

6.模板中引用app.js的全局变量

模板文件不能使用 app.js 文件中定义的全局变量

7. wxs文件中不能使用let声明变量

不能使用let 不能使用let

1-- 正确
2-- 不能正常运行

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

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

相关文章

  • 微信小程开发由0到1开发,快速开发上线

    摘要:首先先注册微信小程序管理一登录微信公众平台二点击立即注册。注意这里不要用微信公众号登录,小程序账号和微信公众号是不同的。最好从项目直接入手,这里有微信小程序个例子,链接密码有可能会过期,留言或者加我,给你最新的 首先先注册微信小程序管理 一、登录微信公众平台https://mp.weixin.qq.com 二、点击立即注册。 注意:这里不要用微信公众号登录,小程序账号和微信公众号是不...

    seal_de 评论0 收藏0
  • 微信小程开发由0到1开发,快速开发上线

    摘要:首先先注册微信小程序管理一登录微信公众平台二点击立即注册。注意这里不要用微信公众号登录,小程序账号和微信公众号是不同的。最好从项目直接入手,这里有微信小程序个例子,链接密码有可能会过期,留言或者加我,给你最新的 首先先注册微信小程序管理 一、登录微信公众平台https://mp.weixin.qq.com 二、点击立即注册。 注意:这里不要用微信公众号登录,小程序账号和微信公众号是不...

    CrazyCodes 评论0 收藏0
  • 微信小程开发由0到1开发,快速开发上线

    摘要:首先先注册微信小程序管理一登录微信公众平台二点击立即注册。注意这里不要用微信公众号登录,小程序账号和微信公众号是不同的。最好从项目直接入手,这里有微信小程序个例子,链接密码有可能会过期,留言或者加我,给你最新的 首先先注册微信小程序管理 一、登录微信公众平台https://mp.weixin.qq.com 二、点击立即注册。 注意:这里不要用微信公众号登录,小程序账号和微信公众号是不...

    wdzgege 评论0 收藏0
  • 甲由科技指出小程开发过程中需要注意的地方

    摘要:在小程序开发和设计的任务和流程过程当中,会出现一些异常情况,这也是用户最需要用到的时候,所以需要特别注意异常状态,在出现问题的时候能给用户明确的提示和一些解决方法。 不少企业、商家都开发了属于自己的小程序。需要提醒大家的是,在开发之前一定要做好充足的准备工作,从而保障开发工作能够顺利完成。 那么,小程序开发前要做什么准备?showImg(https://segmentfault.com...

    chadLi 评论0 收藏0
  • 微信小程开发中遇到的问题及解决办法(三)

    摘要:资料整理关于配置微信小程序页面附关于微信搜索小程序内页面的功能,只能在线上环境有用,而且没有提供测试的渠道。二微信小程序激励视频广告接入微信视频广告指引截图具体使用注意激励视频广告组件是一个原生组件,层级比普通组件高。 大纲:根据近期我在小程序开发中接到的需求,总结一下下面四个开发需求所遇到的问题: 1、关于微信现已开放小程序内搜索(sitemap 配置);2、微信小程序的激励视频广告...

    Lowky 评论0 收藏0

发表评论

0条评论

geekzhou

|高级讲师

TA的文章

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