uniapp WeChat アプレット pageScrollTo 無効

問題の説明: uniapp を使用して WeChat アプレットを記述し、フォームのフォーム検証を行い、検証が失敗したときに対応する位置にスクロールし、wx を使用します。

 wx.pageScrollTo({
    selector: key,
    duration: 500,
    offsetTop: 0,
    })

この問題の原因は、uniapp の html コンポーネントに id を追加することであり、アプレットをコンパイルした後に id が見つからない

解決策: uniapp コンポーネントで <view> のレイヤーをラップし、id を追加します

<uni-forms v-else ref="form" :modelValue="info" :label-width="100"> 
    <view id="xm">
          <uni-forms-item label="姓名" required name="xm">
                <uni-easyinput v-model="workerinfo.xm" placeholder="请输入姓名"/>
          </uni-forms-item>
    </view>
</uni-forms>

<script>

    export default {
        name: "edit",
        data() {
            return {
                info: {
                    xm:'',
                },
                rules: {
                    xm: {
                        rules: [{
                            required: true,
                            errorMessage: '请输入姓名'
                        }]
                    },
                },
            }
        },
        onShow() {
               // #ifdef MP || H5
                    this.$nextTick(() => {
                        this.$refs.form.setRules(this.rules);
                    });
                // #endif

        },

        methods: {

            submit() {
                this.$refs['form'].validate().then(res => {
                   
                }).catch(err => {
                    let key = '#' + err[0].key
                    wx.pageScrollTo({
                        selector: key,
                        duration: 500,
                        offsetTop: 0,
                        success: function () {

                        }
                    })
                })


            },

        }
    }
</script>