vue.js weui picker怎么用 ?

查看:250
本文介绍了vue.js weui picker怎么用 ?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

https://weui.io/ 里面的picker怎么用
$('#showPicker').on('click', function () {

        weui.picker([{
            label: '飞机票',
            value: 0
        }, {
            label: '火车票',
            value: 1
        }, {
            label: '的士票',
            value: 2
        },{
            label: '公交票 (disabled)',
            disabled: true,
            value: 3
        }, {
            label: '其他',
            value: 4
        }], {
            onChange: function (result) {
                console.log(result);
            },
            onConfirm: function (result) {
                console.log(result);
            }
        });
    });
    
    想用vue.js 实现

解决方案

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>

    <body>
        <div id="showPicker" @click="checkPicker"></div>
        
        
        
        <script type="text/javascript">
            new Vue({
                el:'body',
                methods:{
                    checkPicker:function(){
                        weui.picker(
                            [
                                {
                                label: '飞机票',
                                value: 0
                                   },{
                                    label: '火车票',
                                    value: 1
                                }, {
                                    label: '的士票',
                                    value: 2
                                },{
                                    label: '公交票 (disabled)',
                                    disabled: true,
                                    value: 3
                                }, {
                                    label: '其他',
                                    value: 4
                                }
                            ], 
                                {
                                    onChange: function (result) {
                                        console.log(result);
                                    },
                                    onConfirm: function (result) {
                                        console.log(result);
                                    }
                                }
                        );
                    };
                    
                }
            })
        </script>
    </body>

</html>

这篇关于vue.js weui picker怎么用 ?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆