博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
小程序开发注意事项
阅读量:6406 次
发布时间:2019-06-23

本文共 1585 字,大约阅读时间需要 5 分钟。

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

1. 轮番图 swiper


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

clipboard.png

解决方法是:(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标签的默认值设置无效


clipboard.png

我们把value设置为任意值,是不能改变输入框的值的。方法是
<textarea >{
{''}}</textarea>
就可以设置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上下载。

地址

clipboard.png

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


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

clipboard.png

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

不能使用let 不能使用let

clipboard.png

1-- 正确

2-- 不能正常运行

转载地址:http://kyhea.baihongyu.com/

你可能感兴趣的文章
jvm 学习(一)
查看>>
JavaScript简介
查看>>
SQL Server附加数据库拒绝访问解决方法汇总
查看>>
SM2算法原理及实现
查看>>
RHCA教材翻译计划
查看>>
js-小括号在不同场合下的作用
查看>>
我的友情链接
查看>>
kvm中虚拟机的硬盘扩容
查看>>
Android (Launch Mode) 四种启动模式
查看>>
透视学理论(二)
查看>>
Dubbo/HSF在Service Mesh下的思考和方案
查看>>
Django form表单
查看>>
CTYL-9.14(tomcat端口与阿里云安全组,域名与tomcat配置,域名与反向代理)
查看>>
Java 多线程相关问题记录
查看>>
LNMP架构介绍、MySQL安装、PHP安装、 Nginx介绍
查看>>
简单的Spark+Mysql整合开发
查看>>
阿里java面试经验大汇总(附阿里职位需求)
查看>>
Python全套零基础视频教程+软件2018最新编程视频!
查看>>
内存管理之1:x86段式内存管理与保护模式
查看>>
20180925上课截图
查看>>