#组件使用说明
>示例数据均为静态数据,接口生成如下结构的数据:(已上传完整demo)
---
#### 索引列表
```
{
"A": [{
"id": 56,
"spell": "aba",
"name": "阿坝"
}]
......
}
```
#### 通讯录列表
```
{
"A": [{
"id": 56,
"spell": "zs",
"name": "张三",
"phoneNumber":"13143599999"
}]
......
}
```
> id spell name 为必须字段 phoneNumber字段如果没有则不返回
---
#### 使用示例 (phones.vue)
```
<template>
<view>
<phone-directory :phones="phones" @paramClick="paramClick"></phone-directory>
</view>
</template>
<script>
import phoneDirectory from '@/components/phone-directory/phone-directory.vue'
export default {
name:"phones",
components:{
phoneDirectory
},
data() {
return {
//示例数据
phones:{
"A": [{
"id": 56,
"spell": "aba",
"name": "阿坝"
}, {
"id": 57,
"spell": "akesu",
"name": "阿克苏"
}, {
"id": 58,
"spell": "alashanmeng",
"name": "阿拉善盟"
}, {
"id": 59,
"spell": "aletai",
"name": "阿勒泰"
}, {
"id": 60,
"spell": "ali",
"name": "阿里"
}, {
"id": 61,
"spell": "ankang",
"name": "安康"
}, {
"id": 62,
"spell": "anqing",
"name": "安庆"
}, {
"id": 63,
"spell": "anshan",
"name": "鞍山"
}, {
"id": 64,
"spell": "anshun",
"name": "安顺"
}, {
"id": 65,
"spell": "anyang",
"name": "安阳"
}, {
"id": 338,
"spell": "acheng",
"name": "阿城"
}, {
"id": 339,
"spell": "anfu",
"name": "安福"
}, {
"id": 340,
"spell": "anji",
"name": "安吉"
}, {
"id": 341,
"spell": "anning",
"name": "安宁"
}, {
"id": 342,
"spell": "anqiu",
"name": "安丘"
}, {
"id": 343,
"spell": "anxi",
"name": "安溪"
}, {
"id": 344,
"spell": "anyi",
"name": "安义"
}, {
"id": 345,
"spell": "anyuan",
"name": "安远"
}],
"B": [{
"id": 1,
"spell": "beijing",
"name": "北京"
}, {
"id": 66,
"spell": "baicheng",
"name": "白城"
}, {
"id": 67,
"spell": "baise",
"name": "百色"
}, {
"id": 68,
"spell": "baishan",
"name": "白山"
}]
........
}
}
},
methods : {
paramClick (e) {
console.log(e)
}
}
}
</script>
<style>
</style>
```
#### 使用示例 (phone-search.vue)
```
<template>
<view>
<phone-search-list :phones="phones" @paramClick="paramClick"></phone-search-list>
</view>
</template>
<script>
import phoneSearchList from '@/components/phone-directory/phone-search-list.vue'
export default {
name:"phone-search",
components:{
phoneSearchList
},
data() {
return {
phones:null,
}
},
onLoad (option) {
this.phones = JSON.parse(unescape(option.phones))
},
methods:{
paramClick (e) {
console.log(e)
}
}
}
</script>
<style>
</style>
```
#### 引入
>把phone-directory目录拷贝至项目components
>把pages下的phones目录拷贝至项目pages目录下
>在项目pages.json文件写入
(```)
{
"path" : "pages/phones/phones",
"style" : {
"navigationBarTitleText" : "通讯录",
"app-plus":{
"bounce":"none",
"scrollIndicator":"none"
}
}
},
{
"path" : "pages/phones/phone-search",
"style" : {
"navigationBarTitleText" : "搜索联系人"
}
}
(```)
### 组件参数说明
属性名|类型|是否必填|说明
--|:--:|--:
phones|Object|是|接口数据
paramClick|Object|是|当点击时返回对应参数
>文件名 参数 也可自己定义 搜索框内容可在phone-directory.vue 和phone-search-list.vue 文件修改
没有合适的资源?快使用搜索试试~ 我知道了~
省钱兄人力资源招聘社会校招类型招聘系统校园招聘 uniapp前端模板
共426个文件
vue:151个
png:151个
js:68个
需积分: 0 0 下载量 159 浏览量
2024-05-23
13:45:44
上传
评论
收藏 2.79MB ZIP 举报
温馨提示
开源招聘系统源码,由于是商业版本版本,目前只开源用户端版本部分模块源码提供学习研究,使用uniapp技术,提供学习使用不可商业,商业使用请联系授权 适配支持公众号+APP+H5+小程序,使用Hbuilder导入即可运行 轮播,金刚区,分类,搜索,筛选简历,城市,求职意向,企业入住,简历,筛选岗位,身份选择,发布岗位,行业选择、岗位选择提供需要学习的朋友研究学习使用
资源推荐
资源详情
资源评论
收起资源包目录
省钱兄人力资源招聘社会校招类型招聘系统校园招聘 uniapp前端模板 (426个子文件)
iconfont.css 79KB
icon.css 70KB
icon.css 70KB
icon.css 69KB
simplepro.css 63KB
main.css 63KB
thorui.css 24KB
index.css 22KB
style.css 14KB
common.css 8KB
commodity.css 6KB
animation.css 3KB
main.css 2KB
main.css 2KB
mescroll-down.css 1KB
mescroll-up.css 918B
mescroll-body.css 794B
mescroll-uni.css 712B
.DS_Store 8KB
.DS_Store 6KB
.DS_Store 6KB
.DS_Store 6KB
.DS_Store 6KB
.DS_Store 6KB
labagif.gif 3KB
index.html 1KB
taobao.jks 2KB
up.jpg 15KB
area.js 164KB
data.js 76KB
qrcode.js 42KB
QS-SharePoster.js 37KB
QRCodeAlg.js 34KB
async-validator.js 33KB
mescroll-uni.js 32KB
weCropper.js 31KB
uqrcode.js 30KB
citys.js 30KB
citySelect.js 21KB
ican-H5Api.js 21KB
MpHtmlParser.js 18KB
city.js 18KB
app.js 13KB
md5.js 12KB
share.js 8KB
httpRequest.js 8KB
area1.js 6KB
index.js 6KB
image-tools.js 5KB
index.js 4KB
queue.js 4KB
test.js 4KB
mixins.js 4KB
colorGradient.js 4KB
route.js 3KB
icons.js 3KB
CssHandler.js 3KB
renderjs.js 3KB
mescroll-uni-option.js 2KB
config.js 2KB
mixin.js 2KB
cache.js 2KB
emitter.js 2KB
timeFormat.js 2KB
mescroll-more.js 2KB
mescroll-mixins.js 2KB
mescroll-more-item.js 2KB
guid.js 2KB
getParent.js 2KB
timeFrom.js 2KB
province.js 2KB
queryParams.js 1KB
mescroll-comp.js 1KB
type2icon.js 976B
config.js 934B
debounce.js 881B
color.js 856B
deepMerge.js 789B
$parent.js 777B
throttle.js 770B
main.js 701B
deepClone.js 658B
city1.js 527B
index.js 484B
addUnit.js 374B
mpShare.js 365B
zIndex.js 343B
trim.js 339B
mescroll-i18n.js 299B
randomArray.js 228B
random.js 196B
config.js 194B
toast.js 139B
sys.js 130B
province1.js 97B
bem.js 59B
pages.json 6KB
manifest.json 5KB
package.json 2KB
package.json 701B
共 426 条
- 1
- 2
- 3
- 4
- 5
资源评论
省钱兄科技
- 粉丝: 2492
- 资源: 39
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功