open-index/open-npm huggingface dataset:
npm package: @hiwx/input
Description: --- module: '基础' title: '文本框' ---
Author: huali
Latest version: 0.0.1

---
module: '基础'
title: '文本框'
---

[文本框组件](http://git.hipac.cn/fed-wx-conpoment/yt-wx-input)

## 使用效果

<img src="http://img.hicdn.cn/fed/images/20190128/e5dedd9695741a6513412a79c4cae32e.png" width="375" />

## 安装方法

1、设置npm的源地址

```
sudo npm config set registry http://registry.npm.yangtuojia.com
```
2、安装

```
npm install @yt/wx-input --save
```

3、微信开发者工具---》工具---构建npm



# 使用方法
```
   <view class="mb-24">
      <view>
          <comp placeholder="请输入姓名" bindinputevent="iptVal"></comp>
          <comp placeholder="请输入密码"></comp>
      </view>
  
      <view class="mb-24">
          <comp label="姓名"></comp>
          <comp label="密码"></comp>
      </view>
  
      <view class="p-24">
          <comp placeholder="请输入姓名" bindinputevent="iptVal" wrapCls="card mb-24" name="pName"></comp>
          <comp placeholder="请输入密码" wrapCls="card mb-24"></comp>
      </view>
  
      <view class="p-24">
              <comp label="法人身份证号码" wrapCls="card mb-24" require="{{true}}" name="phone"></comp>
              <comp label="密码" wrapCls="card"></comp>
          </view>
   </view>

index.js
Page({
    iptVal(e) {
        console.log(e);
    }
})
```

## api说明

| 属性名                  | 类型        | 默认值      | 是否必须        | 说明                                              |
|------------------------|-------------|------------|----------------|---------------------------------------------------|
| wrapCls               | String      |   ''       | 否             | 最外层容器样式|
| require               | Boolean      |   false       | 否             | 是否必填，控制是否显示*|
| placeholder               | String      |   ''       | 否             | placeholder 内容
| label           | String    |            | 否             | 左侧标题   |
| value           | String         |             |               | 文本框value
| type            | String  | 'text' |否 |input 的类型 text	文本输 入键盘 number	数字输入键盘 idcard	身份证输入键盘 digit	带小数点的数字键盘 textarea 多行输入框
| maxlength  | Number | 140 | 否 | 最长字符
| disabled  | Booleanfalse 可否输入
| placeholder-class | String | '' | 否 |placeholder样式
| class | String | '' | 否 |文本框样式
| bindinputevent  | Function | '' | 否 |键盘输入时触发
| bindinputfocus  | Function | '' | 否 |输入框聚焦时触发
| bindinputblur | Function | '' | 否 |输入框失去焦点时触发
| bindinputconfirm  | Function | '' | 否 | 点击完成按钮时触发
npm package: @hiwx/search
Description: --- category: Components           cols: 1                                   type: 交互              title: wxSearch             subtitle: 搜索框    app: wx                  author: meiqin                     ---
Author: ythipac
Latest version: 0.0.1

---
category: Components          
cols: 1                                  
type: 交互             
title: wxSearch            
subtitle: 搜索框   
app: wx                 
author: meiqin                    
---

## 使用效果

<img src="http://img.hicdn.cn/fed/images/20190109/de7e71cac0fbf8adf27666205bd69e7d.png" width="375" />
```jsx
```

微信开发者工具---》工具---构建npm


## 使用说明-推荐

```
 index.wxml文件

 <view class="mt-32">
     <search
       placeholder="商品名称、收货姓名、收货手机号、订单编号"
       bind:onsearch="onSearchBtn" >
     </search>

     <search
       placeholder="商品名称、收货姓名、收货手机号、订单编号"
       bind:onsearch="onSearchBtn"
       rightText="取消" >
     </search>

     <search
         placeholder="商品名称、收货姓名、收货手机号、订单编号"
         bind:onsearch="onSearchBtn"
         rightText="" >
       </search>
 </view>



index.js文件

Page({
    onSearchBtn(value, e) {
        console.log('onSearchBtn===', value, e);
    }
})


index.json文件

{
        "navigationBarTitleText": "search demo页面",
        "usingComponents": {
            "search": "@yt/wx-search"
    }
}

```


## api说明

| 属性名                  | 类型        | 默认值      | 是否必须        | 说明                                              |
|------------------------|-------------|------------|----------------|---------------------------------------------------|
| placeholder            | String      | ''         | 否             | placeholder文案                                |
| placeholderStyle       | String      | ''         | 否             | placeholder样式   |
| rightText              | String      | '搜索'     | 否              | 右侧点击文案，默认搜索                                |          |
| searchValue            | String      | ''         | 否              | 默认值                                           |
| searchFocus             |Boolean     |  false     | 否               |自动聚焦   |
| searchDisabled         | Boolean     |  false     | 否               |是否可填  |
| confirmType            | String      | 'done'     | 否              | 设置键盘右下角按钮的文字，仅在type='text'时生效,confirm-type的有效值有：send，search，next，go，done |
| wrapClass              | String      |            | 否              |传入外部的样式 |
| inputClass             | String      |            | 否              |传入外部的input样式|
| textClass              | String      |            | 否              |传入外部的搜索字样式|
| bind:onsearchconfirm      | Function    | ''         | 否              | 点击键盘完成按钮时触发 |
| bind:onsearchinput        | Function    | ''         | 否              | 键盘输入时触发    |
| bind:onsearch           |    Function    | ''         | 否              | 右侧点击事件    |
| bind:onfocus           |     Function    | ''         | 否              | 输入框聚焦时触发    |