All Projects → lunlunshiwo → Best City

lunlunshiwo / Best City

A Vue.js project for selecting city

Programming Languages

javascript
184084 projects - #8 most used programming language

Labels

Projects that are alternatives of or similar to Best City

Laraciproid
Indonesia city and province data migration and seeder for Laravel.
Stars: ✭ 24 (-81.54%)
Mutual labels:  city
Naija State Local Government
A simple utility library that lists Nigeria states and local governments with zero dependency
Stars: ✭ 50 (-61.54%)
Mutual labels:  city
Ionic2 City Picker
ionic2的省市区三级联动组件
Stars: ✭ 95 (-26.92%)
Mutual labels:  city
Jhaddresspickview
省市区选择器,省市二级选择,省市区三级选择,PickView,地址选择器
Stars: ✭ 12 (-90.77%)
Mutual labels:  city
Province City China
🇨🇳最全最新中国【省、市、区县、乡镇街道】json,csv,sql数据
Stars: ✭ 993 (+663.85%)
Mutual labels:  city
Countries States Cities Database
🌍 World countries, states, regions, provinces, cities, towns in JSON, SQL, XML, PLIST, YAML, and CSV. All Countries, States, Cities with ISO2, ISO3, Country Code, Phone Code, Capital, Native Language, Timezones, Latitude, Longitude, Region, Subregion, Flag Emoji, and Currency. #countries #states #cities
Stars: ✭ 1,130 (+769.23%)
Mutual labels:  city
Citybound
A work-in-progress, open-source, multi-player city simulation game.
Stars: ✭ 6,646 (+5012.31%)
Mutual labels:  city
Cities
Poly files for cities, which can be used to create OSM files out of larger regions
Stars: ✭ 115 (-11.54%)
Mutual labels:  city
Tr Geozones
Ülkeler ve Türkiye İl İlçe Semt Mahalle ve Posta Kodu Veritabanı (Laravel)
Stars: ✭ 46 (-64.62%)
Mutual labels:  city
Android Citylist
城市列表选择,类似美团城市选择
Stars: ✭ 77 (-40.77%)
Mutual labels:  city
Coffeetrip
Find a good coffee shop in a city.
Stars: ✭ 14 (-89.23%)
Mutual labels:  city
Highcharts China Geo
Highcharts 中国地图,Highcharts 中国省市地图,Highcharts China Map,南海诸岛geo
Stars: ✭ 29 (-77.69%)
Mutual labels:  city
Travel Mate
A complete travel guide!
Stars: ✭ 1,143 (+779.23%)
Mutual labels:  city
Osmnx Examples
Usage examples, demos, and tutorials for OSMnx.
Stars: ✭ 863 (+563.85%)
Mutual labels:  city
Citypicker
一个仿大众点评、美团的城市选择器,使用如同Rx一样优雅,并且UI和城市数据可以自定义
Stars: ✭ 97 (-25.38%)
Mutual labels:  city
Regex Assert Symfony
Common Regex to use with Assert in Symfony's entity
Stars: ✭ 5 (-96.15%)
Mutual labels:  city
World Cities
Multilingual list of countries, states & cities in XML format. 世界所有城市,国内所有省、市、区、县信息(2020.06)
Stars: ✭ 64 (-50.77%)
Mutual labels:  city
Administrative Divisions Of China
中华人民共和国行政区划:省级(省份直辖市自治区)、 地级(城市)、 县级(区县)、 乡级(乡镇街道)、 村级(村委会居委会) ,中国省市区镇村二级三级四级五级联动地址数据。
Stars: ✭ 11,727 (+8920.77%)
Mutual labels:  city
Eden Smart Contracts
EDEN - EDN Smart Token & Smart Contracts
Stars: ✭ 109 (-16.15%)
Mutual labels:  city
Visual Town Budget
Open-source budget visualization framework.
Stars: ✭ 74 (-43.08%)
Mutual labels:  city

best-city

npm downloads

best-city 是什么

best-city 是一款用于解决移动端选择城市需求的插件。在兼顾体验度如丝般顺滑的同时,做到了市面上大多数插件不曾拥有的交互体验,力求做到如真实的ntive般的体验。

不仅在移动网页端,best-city 在还是雏形阶段时已经被应用到了H5+混合移动app应用中,并成为应用的一大亮点。

在best-city的右边是一条Nav,不仅仅可以点击,还能如丝般顺滑的滑动,手指划过Nav,与城市列表交互的感觉是别的插件无法带给你的。

Attributes

在1.0.1发布的best-city中,用户可以根据设置属性来定制属于自己的移动端城市选择组件。

参数 说明 类型 可选值 默认值
slide 插件页面过渡动画 String vertical/horizontal vertical
canSearchSpell 是否支持拼音搜索 Boolean true/false true
location 当前定位 Object —— 北京
backStyle 返回键的样式 String cross/retreat/tilted/fold/return retreat

Events

在1.0.1发布的best-city中,用户可以根据事件在获得插件的返回值。

事件名称 说明 回调参数
closeChooseCity 关闭城市选择插件的事件 选中的 city 对象 / null

Methods

在1.0.1发布的best-city中,用户可以调用插件的方法达到自己的目的。

方法名称 说明 回调参数
show 打开城市选择插件 ——
hide 关闭城市选择插件 ——

用法

best-city用法简单,首先下载依赖:

npm install best-city -S

然后添加到你的项目中, 将下列代码加在 main.js中:

import BestCity from 'best-city'

Vue.use(BestCity)

Model

<template>
  <div id="app">
    <button @click="showCity">点击</button>
    <best-city
      ref="vuecity"
      @closeChooseCity="getCity"
    ></best-city>
  </div>
</template>
export default {
  name: 'app',
  methods: {
    getCity(val) {
      console.log(val);
    },
    showCity() {
      this.$refs.vuecity.show();
    }
  }
};

Screenshot

代码注释思路以master分支的文档为例,代码的优雅准确以npm0.1分支为例。

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].