可以通過表單將輸入框里的內容提取出來
~~~
<form class="form" bindsubmit="onConfirm">
<button class="btn" plain="{{true}}" formType="submit">提交</button>
<input type="text" auto-focus confirm-type="search" name="search" value="{{value}}" bindconfirm="onConfirm" placeholder="輸入內容" />
</form>
~~~
由于提交按鈕獲取到的值的數據格式與通過輸入框搜索/回車獲取到的值的數據格式不同,所以會對其進行一次判斷
~~~
Page({
data: {
value: ""
},
onConfirm(options){
var value = options.detail.value.search;
console.log(typeof(value));
if(typeof(value)!='string'){
var value = options.detail.value
}
if(value){
this.setData({
value: "",
})
}
} else{
wx.showToast({
title: '輸入內容才能評論',
icon: 'none'
})
}
}
})
~~~
使用input輸入框時的注意事項:
* confirm-type,可以設置鍵盤右下角的文字,僅在type="text"時生效,值有:send/search/next/go/done
* value,為輸入框初始內容,可以在輸入完成時設置value為空,達到自動清除輸入內容的效果
* bindinput,鍵盤輸入時觸發
* bindfocus,輸入框聚焦時觸發
* bindblur,輸入框失焦時觸發
* bindconfirm,輸入完成,提交時觸發(本例中使用過)
- 小程序環境配置
- 1.生命周期
- 頁面生命周期
- 組件生命周期
- 2.小程序組件
- 點擊事件bindtap|catchtap
- swiper輪播
- wx:for循環
- 播放音樂
- map
- tabBar底部頁面切換
- scroll-view可滾動視圖區域。
- web-view裝載顯示網頁
- priviewImage新頁面預覽照片
- chooseImage本地選擇照片
- onReachBottom上拉刷新,加載等待條
- setStorage緩存
- showToast彈出提示框
- slot父組件wxml傳遞到子組件
- form表單
- 小程序.wxs,方法在.wxml調用
- 3.組件前身:模板、模板傳參
- 4.自定義組件、組件傳參|傳wxss|wxml代碼
- 5.小程序正則
- 6.小程序頁面跳轉
- 7.open-type 微信開放功能
- 實例
- 1.第一個實例 hello world
- 2.第二個實例豆瓣電影數據渲染
- 豆瓣1.0基本版
- 豆瓣2.0升級版
- 豆瓣3.0豪華版
- 3.第三個實例多接口在同一頁面使用
- HTTP封裝
- 基礎報錯提示,類式封裝
- Promise回調,類式封裝