小程序开发注意事项

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

1. 轮番图 swiper

---

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

解决方法是：
（1） autoplay='{{false}}'直接这么写，就可以当作boolean值来处理了。
（2） <swiper class='swiper' indicator-dots="true" indicator-active-color='#FFFFFF' autoplay='{{autoplay}}'></swiper>
在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，或者使用<image/>标签。但是不能使用本地图片。

---

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

---

我们把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文件中写，例如

<wxs module="m1">
        var msg = "hello world";
        module.exports.message = msg;
  </wxs>

  <view> {{m1.message}} </view>

（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文件中引入


        <wxs src="./../comm.wxs" module="tools" />
        <view> {{tools.bar(tools.FOO)}} </view>
        
        

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-- 不能正常运行