Neptunium, Promethium, Manganese

    lm-citypanel

    0.2.0 • Public • Published

    citypanel

    • 作者:liuduan
    • 邮箱:liuduan.05.05@163.com
    • 版本:0.2.0

    介绍

    城市列表选择面板组件 - 按拼音首字母排序

    安装

    lm-* 组件使用 npm 进行管理,命名空间统一为 lm-,请使用以下命令进行组件安装。

    npm i lm-citypanel --save
    
    • 如果你还没有安装 npm,可通过以下方式进行 安装
    • 安装cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org

    使用

    样例文档

    GitHub set up

    使用

    <Citypanel
        data={citydata}
        selected={selected}
        showState={showState}
        onSelect={this.onSelect}
        title='请选择城市'
        onOk={this.onOk}
        opacity={0.4}
        onDismiss={this.onDismiss}
    />
     

    数据结构要求

    {
        A: [
            {
                cityName:xxx, 
                cityCode: xxx
            },
            ...
        ], 
        B: [
            ...
        ], 
        C: [
            ...
        ], 
        ...
    }

    如果后台返回不是上述数据结构需转换为该结构形式,可借鉴/dome/app.js中的 parseCitylist 方法

    配置参数

    Prop Type Default Description
    className String '' 自定义类名
    data Object isRequired {} 城市列表数据
    selected Object {} 当前被确认选中城市
    至少含有城市编码cityCode和城市名region两个属性
    showState Bool isRequired false 控制组件显示隐藏
    onSelect Function arg => { console.log(arg) } 点选城市后的回调函数,参数为点选城市信息对象
    结构同selected参数
    onClick Function arg => { console.log(arg) } 点选城市面板后的回调函数
    opacity Number 0 遮罩透明度
    title String 请选择城市 popup标题
    okText String undefined popup右侧文本
    dismissText String undefined popup右侧文本
    onOk Function - 点击popup右侧按钮回调,参数为选中城市信息
    onDismiss Function - 点击popup左右按钮回调,参数为组件显示时的城市信息
    onMaskClick Function - 点击mask回调,参数为组件显示时的城市信息
    popheaderHeight Number 44 popup组件-header高度
    noanimate Bool false 禁止组件显示时自动滚动动画

    注意事项

    • 组件注意事项

    开发调试

    进入项目目录后,使用 node 命令启动服务

    npm run start
    

    打包发布可通过 node 命令执行

    npm run build
    npm publish
    

    相关资料


    Changelog

    0.1.0

    1. init

    0.1.2

    1. 修改readme
    2. 修复iphone5显示样式bug

    0.1.3

    1. 更新支持lm-popup@0.1.3版本

    0.1.4

    1. 合并popup上属性到citypanel

    0.1.5

    1. 解决for of语句兼容问题,改为forEach
    2. 增加popup左右显示文字配置属性、暴露onMaskClick钩子

    0.1.7

    1. 解决华为手机app中无法滚动:卸载了portal组件
    2. 更新了demo

    0.1.8

    1. 添加了遮罩

    0.1.10

    1. 修复了点击按钮报错bug

    0.1.11

    1. 修复初始不显示选中bug

    0.1.12

    1. 修改为lm-popuo依赖

    0.1.13

    1. 修复了初始选中值不在列表范围中会报错的问题

    0.2.0

    1. 升级至react16版本

    Install

    npm i lm-citypanel

    DownloadsWeekly Downloads

    2

    Version

    0.2.0

    License

    none

    Unpacked Size

    91.2 kB

    Total Files

    12

    Last publish

    Collaborators

    • davidfeng
    • maqing01
    • tony-liuduan