lookcommon_course/pages_tool/pages/codePars/codePars.vue

<template>
    <view class="IDCard-box">
        <view class="pages-box">
            <view class="fs32 fc99">请输入您要查询的文字</view>
            <view class="inp-box">
                <input @input="codeFun" class="inp" placeholder="汉字" placeholderStyle="font-size:30rpx" />
                <view class="inpimg">
                    <image class="pagesimg" src="/static/images/search.png"></image>
                </view>
            </view>
            <view class="btn-box">
                <button @tap="getdataFun" class="btn fs32">查 询</button>
            </view>
        </view>
        <view :class="'det-box ' + (show ? '' : 'dp-n')">
            <view class="pg-t fs36 fc99">详细信息</view>
            <view class="pglist fc99 bd-n">
                <view class="pg-l fs32">电码：</view>
                <view class="pg-r fs32">{{ getdata.telecodes }}</view>
            </view>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            code: '',
            show: false,
            getdata: {
                telecodes: ''
            }
        };
    },
    onShareAppMessage: function () {},
    methods: {
        codeFun: function (t) {
			this.code=t.detail.value;
        },

        getdataFun: function (t) {
            var that = this;
            uni.showLoading({
                title: '加载中'
            });
            var e = this.code;
            uni.request({
                url: 'https://v.juhe.cn/telecode/to_telecodes.php?chars=' + e + '&key=3aa4901b44d02790f816f414284a1391',
                data: {},
                header: {
                    'content-type': 'application/json'
                },
                success: function (t) {
                    uni.hideLoading();
                    if ('success' == t.data.reason) {
						that.show=true;
						that.getdata=t.data.result;
                    } else {
                        uni.showModal({
                            title: '提示',
                            content: '查询失败',
                            success: function (t) {
								that.show=false;
                            }
                        });
                    }
                }
            });
        }
    }
};
</script>
<style>
@import './codePars.css';
</style>