小程序详细步骤使用方法（小程序的基本使用知识点非常全面，推荐！）

<template name="compoent">
<view>哈哈哈</view>
  <text>嘿嘿嘿</text>
  <text>{{name}}</text>
  <text>{{age}}</text>
</template>
<template is="compoent"/>
<template is="compoent"/>
<template is="compoent"/>
<template is="compoent" data= "{{name: '小屏', age:'123'}}" />

{
  "usingComponents": {
    "my-cut":"/pages/compent/my-cut"  }
}

  // 在组件里面设置options的 styleIsolation: "apply-shared"会是页面设置的样式属性影响组件的样式
  // 在组件里面设置options的 styleIsolation: "shared"会是页面设置的样式属性影响组件的样式
  Component({
	options:{
    styleIsolation: "apply-shared"
  },
})

Component({
properties: {
    // title: String
    title:{
      type: String,
      value:"我是默认值",
      //监听新值和旧值
      observer: function(newVal,oldVal){
        console.log(newVal,oldVal)
      }
    },
    
  },
    // 在组件中可以利用这个属性来动态设置设置css的样式
  externalClasses:["tltleclass"]

})

<my-cut title="哈哈" tltleclass="red"></my-cut>
<my-cut title="嘿嘿" tltleclass="green" />
<my-cut/>

.red{
  color: red;
}
.green{
  color: green;
}

<view class="contention">
  <block wx:for="{{titled}}" wx:key="index">
    <view class="tit"> <text class="intext {{index == increat? 'active' : ''}}" data-count="{{index}}" bindtap="targetTap">{{item}}</text> </view>
  </block>
</view>

methods: {
    targetTap(e){
      const index  = e.currentTarget.dataset.count
      this.setData({
        increat:index
      })
        this.triggerEvent("targetCount" , {})
    },
    amend(){
      this.setData({
        titled: ["政治", "数学", "英语"]
      })
    }

  }

<switch titled="{{list}}" bind:targetCount="targetCount" class="sw-class"></switch>

  targetCount(){
  //获取组件对象
    const content = this.selectComponent('.sw-class') 
    console.log(content)
    // content.setData({
    //   titled:["政治", "数学", "英语"]
    // })
    // 开放规范一般不推荐这种直接在函数的修改方法，建议在组件内使用methods内部以方法的形式修改，在页面调用即可
    content.amend()
  },

<view>
  我是一个标题
</view>
<slot></slot>
<view>
  我是一个内容
</view>

<my-slot>
<button size="mini"> 按钮</button>
</my-slot>
<my-slot>
 <image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg2.woyaogexing.com%2F2021%2F04%2F26%2F1b402c98095d452486508b8250b21f3f%21360x640.jpg" alt="小程序详细步骤使用方法（小程序的基本使用知识点非常全面，推荐！）" border="0" />

<view>我是多插槽的标题</view>
<view> <slot name="slot1" ></slot> </view>
<view> <slot name="slot2" ></slot> </view>
<view> <slot name="slot3" ></slot> </view>
<view>我是多插槽的尾部</view>

Component({
  /**
   * 组件的属性列表
   */
  options:{
    multipleSlots:true
  }
  )}

<!-- 多插槽的使用 -->
<!-- 注意事项:
需要给每一个插槽取一个名字
必须在component对象下面的options对象下面的multipleSolts属性设置为true -->
<my-mslot>
<button slot="slot3">415461</button>
<slider slot="slot1" value="20"></slider>
<text slot="slot2">呵呵呵呵呵</text>
</my-mslot>

properties:{ 
	title: string,
	content:{
	type: array,
	value:[1,2.3],
	observer:function(newVal,oldVal){
        console.log(newVal,oldVal)
      }
	}
}

data:{
	counter：0
}	

methods:{
foo(){
	
}
}

options:{
//在需要使用多插槽时设置为true
	multipleSlots:true,
	//设置样式的隔离方式
	styleIsolation: "apply-shared", //页面设置的样式属性影响组件的样式
   //styleIsolation: "shared"  页面设置的样式属性影响组件的样式
}

externalClasses:["on","tre"]

observers:{
	counter: function(newVal){
		console.log(newVal)
	}
}

  pageLifetimes:{
    show(){
      console.log("监听组件所在页面显示出来的")
    },
    hide(){
      console.log("监听组件所在页面隐藏起来的时候")
    },
    resize(){
      console.log("监听页面尺寸的改变")
    }
  }

lifetimes:{
    created(){
      console.log("组件被创建")
    },
    attached(){
      console.log("组件被添加到页面中")
    },
    ready(){
      console.log("组件被渲染出来")
    },
    moved(){
      console.log("组件被移动到节点树的另一个位置")
    },
    detached(){
      console.log("组件")
    }
  }

onReady: function () {
    wx.request({
      url: 'http://httpbin.org/post',
      method:'post',
      data:{
        name:"wangshuai",
        age:19
      },
      success:function(res){
          console.log(res)
      }
    })
  },

export default function request(option) {
    return new Promise( (resolve, reject) => {
      wx.request({
        url: option.url,
        method: option.method || 'get',
        data: option.data || {},
        success: function (res) {
            resolve(res)
        },
        fail: function (res) {
          reject(res)
        }
      })
    })
}

 onReady: function () {
    //小程序原生网络请求
    // wx.request({
    //   url: 'http://httpbin.org/post',
    //   method:'post',
    //   data:{
    //     name:"wangshuai",
    //     age:19
    //   },
    //   success:function(res){
    //       console.log(res)
    //   }
    // })
    request({url: 'http://httpbin.org/post',method:"post"}).then(res=>{
      console.log(res)
    }).catch(err =>{
      console.log(err)
    })
  },

<button size="mini" bindtap="showToast">showToast</button>
<button size="mini" bindtap="showModal">showModal</button>
<button size="mini" bindtap="showLoading">showLoading</button>
<button size="mini" bindtap="showAction">showAction</button>
<button size="mini" open-type="share">分享</button>

Page({
	showToast(){
    wx.showToast({
      title: '我是showToast',
    })
  },
  showModal(){
    wx.showModal({
      title:'是否删除',
      cancelColor: 'cancelColor',
      success:function (params) {
          console.log(params)
          if (params.cancel) {
              console.log("点击了取消删除")
          } 
      } 
    })
  },
  showLoading(){
    wx.showLoading({
      title: '等待中',
      mask: true //给一个遮罩，防止其他操作
    })
    setTimeout(()=>{
      wx.hideLoading({
        success: (res) => {},
      })
    },1500)
  },
  showAction(){
    wx.showActionSheet({
      itemList: ['拍照','文件'],
    })
  }
})

<navigator url="/pages/home/home">跳转home</navigator>

<navigator url="/pages/home/home">跳转home</navigator>
<navigator url="/pages/home/home" open-type="redirect">跳转home(redirect)</navigator>
<navigator url="/pages/home/home" open-type="reLaunch">跳转home(reLaunch)</navigator>
<navigator url="/pages/home/home" open-type="switchTab">跳转home(switchTab)</navigator>