表单组件嵌入语音录入

components/Yl_field/index.js

@@ -1,4 +1,5 @@
 const verify = require('../../utils/deleteMark');
+
 Component({
     externalClasses: [],
     properties: {
@@ -18,11 +19,19 @@ Component({
     },
     data: {
         temporary: null, //route选择暂存选中项
+        voiceIndex: null,
+        seconds: 60,
     },
     options: {
         multipleSlots: true //允许使用多个slot
     },
     methods: {
+        onVoiceInput(e) {
+            this.setData({
+                [`form[${e.currentTarget.dataset.index}].value`]: e.detail
+            });
+            this.confirm();
+        },
         toOptions(e) {
             const {
                 item

components/Yl_field/index.json

@@ -4,6 +4,7 @@
         "van-field": "@vant/weapp/field/index",
         "van-transition": "@vant/weapp/transition/index",
         "van-radio": "@vant/weapp/radio/index",
-        "van-radio-group": "@vant/weapp/radio-group/index"
+        "van-radio-group": "@vant/weapp/radio-group/index",
+        "Yl_VoiceInput": "../Yl_VoiceInput/index"
     }
 }

components/Yl_field/index.wxml

@@ -179,7 +179,12 @@
         </view>
         <!-- 输入框 -->
         <van-field wx:else label="{{item.label}}" required="{{item.required}}" value="{{ item.value }}" placeholder="{{item.placeholder||'请填写'}}" label-class='label-class' type="{{item.type}}" error="{{item.error}}" error-message='{{item.errMsg}}' disabled="{{item.disabled}}" autosize border="{{ false }}" bind:input="inputChange" data-item="{{item}}">
-            <slot wx:if="{{item.slot}}" name="{{item.slot}}" slot='button' />
+            <view slot='button' style="display: flex;">
+                <view wx:if="{{item.slot}}" style="margin-right: 8rpx;">
+                    <slot name="{{item.slot}}" />
+                </view>
+                <Yl_VoiceInput wx:if="{{item.type=='text'||item.type=='textarea'}}" data-index="{{index}}" bindcallback="onVoiceInput"/>
+            </view>
         </van-field>
     </view>
     <!-- </van-transition> -->

components/Yl_field/index.wxss

@@ -1,5 +1,7 @@
+
 .label-class {
     word-break: break-all;
+    margin-top: 6rpx;
 }
 
 .picker {