用js编写一个city城市列表的样式

最新推荐文章于 2022-08-16 13:27:09 发布

weixin_52721089

最新推荐文章于 2022-08-16 13:27:09 发布

阅读量983

点赞数

文章标签： vue javascript

本文链接：https://blog.csdn.net/weixin_52721089/article/details/113933064

版权

这篇博客讲述了如何在Vue项目中利用 vant 组件库和 JS 编写一个城市列表的样式。首先通过 yarn 安装 vant 和 babel-plugin-import 插件，然后按需引入组件。接着创建伪数据来呈现基本样式，但由于后端提供的数据格式不匹配，需要对样式进行调整和优化以适应实际需求。

摘要由CSDN通过智能技术生成

之前写vue的项目，需要一个城市列表的样式类似这种类似这种的样式
首先我在vue中下载组件 yarn add vant
按照推荐选择按需引入组件安装插件 yarn add babel-plugin-import -D
在项目中引用

import Vue from 'vue'
import {
    IndexBar, IndexAnchor, cell } from 'vant'

Vue.use(IndexAnchor).use(cell).use(IndexBar)

这样我们得到了最基本的样式，
我们这时先创建一条伪数据

data(){
   
	return {
   
		cityList = [{
   value:'A',city:['安阳','安康','安xx','按tt']},{

关注