今日滑块视图容器补充

为了以后动态使用阅读，将图片放入js文件数组中

wx:for
在组件上使用 wx:for 控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。
默认数组的当前项的下标变量名默认为 index，数组当前项的变量名默认为 item（可修改）

wxml文件：

<view >
  <view class="text">
    <text>欢迎来到糊涂商店</text>
  </view>
  <view>
    <swiper indicator-dots="true"  autoplay="true" interval="3000" class="banner">   <!--indicator-dots 指示点-->
      <swiper-item wx:for="{{banner}}"  wx:key="wjl" wx:for-item="newsitem">
        <image src="{{newsitem}}"></image>
      </swiper-item>
    </swiper>
  </view>

</view>

js部分:

  data: {
    banner: ["../photos/1.jpg",
              "../photos/2.jpg",
              "../photos/3.jpg",
              "../photos/4.jpg"],
  },

wxss部分：

/* news/news.wxss */
.text{
  display: flex;
  /* align-items: center;不用纵向的，只用横向的 */
  justify-content: center;  
}
text{
  color: blueviolet;
  align-content: center;
}
.banner{
  width: 100%;
  height: 400rpx;
}

json文件：

{
  "usingComponents": {}
}

学习笔记：
"usingComponents": {} 小程序页面配置（放在里面的json文件）

js格式：

page({ 整体时一个page({})函数，里面传入一个大对象，页面加载的时候会执行这个大函数

/页面初始数据/
data: {
里面放的是页面要用到的数据
}
/生命周期函数页面加载/

onload:function(options){
其他系统会自动生成一些上面周期函数，如页面刚加载时候执行的代码
}

})

因为wxml和wxss和前面学习的HTML和css差不多，所有现在就重点学习一下js了