小程序源码

source/wx/xzs-student/component/iView/input/index.js

@@ -0,0 +1,61 @@
+Component({
+    behaviors: ['wx://form-field'],
+
+    externalClasses: ['i-class'],
+
+    properties: {
+        title: {
+            type: String
+        },
+        // text || textarea || password || number
+        type: {
+            type: String,
+            value: 'text'
+        },
+        disabled: {
+            type: Boolean,
+            value: false
+        },
+        placeholder: {
+            type: String,
+            value: ''
+        },
+        autofocus: {
+            type: Boolean,
+            value: false
+        },
+        mode: {
+            type: String,
+            value: 'normal'
+        },
+        right: {
+            type: Boolean,
+            value: false
+        },
+        error: {
+            type: Boolean,
+            value: false
+        },
+        maxlength: {
+            type: Number
+        }
+    },
+
+    methods: {
+        handleInputChange(event) {
+            const { detail = {} } = event;
+            const { value = '' } = detail;
+            this.setData({ value });
+
+            this.triggerEvent('change', event);
+        },
+
+        handleInputFocus(event) {
+            this.triggerEvent('focus', event);
+        },
+
+        handleInputBlur(event) {
+            this.triggerEvent('blur', event);
+        }
+    }
+});

source/wx/xzs-student/component/iView/input/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

source/wx/xzs-student/component/iView/input/index.wxml

@@ -0,0 +1,31 @@
+<view class="i-class i-cell i-input {{ error ? 'i-input-error' : '' }} {{ mode === 'wrapped' ? 'i-input-wrapped' : '' }}">
+    <view wx:if="{{ title }}" class="i-cell-hd i-input-title">{{ title }}</view>
+    <textarea
+        wx:if="{{ type === 'textarea' }}"
+        auto-height
+        disabled="{{ disabled }}"
+        focus="{{ autofocus }}"
+        value="{{ value }}"
+        placeholder="{{ placeholder }}"
+        maxlength="{{ maxlength }}"
+        class="i-input-input i-cell-bd {{ right ? 'i-input-input-right' : '' }}"
+        placeholder-class="i-input-placeholder"
+        bindinput="handleInputChange"
+        bindfocus="handleInputFocus"
+        bindblur="handleInputBlur"
+    ></textarea>
+    <input
+        wx:else
+        type="{{ type }}"
+        disabled="{{ disabled }}"
+        focus="{{ autofocus }}"
+        value="{{ value }}"
+        placeholder="{{ placeholder }}"
+        maxlength="{{ maxlength }}"
+        class="i-input-input i-cell-bd {{ right ? 'i-input-input-right' : '' }}"
+        placeholder-class="i-input-placeholder"
+        bindinput="handleInputChange"
+        bindfocus="handleInputFocus"
+        bindblur="handleInputBlur"
+    />
+</view>

source/wx/xzs-student/component/iView/input/index.wxss

@@ -0,0 +1 @@
+.i-cell{position:relative;padding:12px 15px;display:flex;background:#fff;align-items:center;line-height:1.4;font-size:14px;overflow:hidden}.i-cell::after{content:'';position:absolute;top:0;left:0;width:200%;height:200%;transform:scale(.5);transform-origin:0 0;pointer-events:none;box-sizing:border-box;border:0 solid #e9eaec;border-bottom-width:1px;left:15px;right:0}.i-cell-last::after{display:none}.i-cell-icon{margin-right:5px}.i-cell-icon:empty{display:none}.i-cell-bd{flex:1}.i-cell-text{line-height:24px;font-size:14px}.i-cell-desc{line-height:1.2;font-size:12px;color:#80848f}.i-cell-ft{position:relative;text-align:right;color:#495060}.i-cell-access .i-cell-ft{padding-right:13px}.i-cell-access .i-cell-ft::after{content:" ";display:inline-block;width:6px;height:6px;position:absolute;top:50%;right:2px;border-width:2px 2px 0 0;border-color:#dddee1;border-style:solid;transform:translateY(-50%) matrix(.71,.71,-.71,.71,0,0)}.i-input{padding:7px 15px;color:#495060}.i-input-wrapped{margin:10px 15px;background-color:#fff}.i-input-wrapped::after{left:0;border-width:1px;border-radius:4px}.i-input-error{color:#ed3f14}.i-input-title{color:#495060;min-width:65px;padding-right:10px}.i-input-input{flex:1;line-height:1.6;padding:4px 0;min-height:22px;height:auto;font-size:14px}.i-input-placeholder{font-size:14px}.i-input-input-right{text-align:right}.i-input.i-input-wrapped::after{display:block}.i-input-wrapped.i-input-error::after{border-color:#ed3f14}