微信小程序（2）

基础简单介绍

app.json文件里

    "navigationBarTextStyle": "black",     导航栏字体颜色
    "navigationBarTitleText": "邀请函",    导航栏文本信息
    "navigationBarBackgroundColor": "#ffffff"     导航栏背景颜色
    
   视口单位vw宽度,vh高度
   1vhw=375px/100

   
   小程序里的页面显示，一个小程序里最多只能有五个页面

    "tabBar": {
       "color": "#999",   字体颜色
      "position": "bottom",  侧边栏固定在下面
      "selectedColor": "#00ffff",   文字选中时的颜色
      "backgroundColor": "#862536",  侧边栏背景颜色
    "list": [{
      "pagePath": "pagePath",   跳转路径，在配置文件里含有的
      "text": "text",   文字
      "iconPath": "iconPath",
      "selectedIconPath": "selectedIconPath"
    },{
      "pagePath": "pagePath",   跳转路径
      "text": "text",
      "iconPath": "iconPath",
      "selectedIconPath": "selectedIconPath"
    }]
  },

index.wxml

<view class="indexBoss">
<!-- mode设置裁剪或缩放
show-menu-by-longpress="false"设置长按显示菜单(转发，分享...) -->
  <image class="indexImg" 
  show-menu-by-longpress="false"
   src="../../images/avatar.png" />
</view>
<view>
  <!-- hover-class设置点击态
  hover-stop-propagation阻止本节点出现父级的点击态
  hover-start-time点击后多久触发点击态
  hover-stay-time松开后保留多久点击态 -->
  <view class="indexText" hover-class="box1"
  hover-start-time="1000"
  hover-stay-time="1000">
    姓名：小丽
  </view>
</view>
<view style="height: 500px;background: pink;">

</view>

轮播图

indicator-dots	开启小圆点
indicator-color	设置小圆点颜色
indicator-active-color	设置选中小圆点颜色
autoplay	自动轮播
current	默认展示第几张
interval	切换轮播时间
circular	自动衔接

user-select长按选中文本，会让当前元素变为行内块
decode解析字符码

<swiper 
indicator-dots="true" 
indicator-color="#333" 
indicator-active-color="red" 
autoplay="true" 
current="0" 
interval="1000" 
circular="true">
  <swiper-item style="background-color:aqua">1</swiper-item>
  <swiper-item style="background-color:pink">2</swiper-item>
</swiper>

<!-- -->
<text user-select="true" decode="true">12345&lt;</text>
<text>111111111&gt;</text>

</view>