1.0.2 • Published 5 months ago
iform-pending v1.0.2
iform-penging
一款基于Vue框架和Element-UI组件库开发的待办中心栏目和待办消息
iform-penging有两种组件:
- 待办中心栏目(iform-penging-column)
- 待办消息(iform-penging-message)
install 安装
npm install iform-penging --save
use 使用
在main.js中写入下面的代码
import Vue from 'vue'
import IformPenging from 'iform-penging'
Vue.use(IformPenging)
接下来,你就可以在页面中使用IformPenging
<template>
<iform-pending-message
:url="pendingUrl"
:headers="pendingHeaders"
:more-url="pendingMoreUrl"
/>
<p/>
<iform-pending-column
:url="pendingUrl"
:headers="pendingHeaders"
:more-url="pendingMoreUrl"
:height="430"
/>
</template>
<script>
export default {
data () {
return {
//api地址
pendingUrl:"http://192.168.3.230:42000/iform",
//api地址请求头,主要设置token
pendingHeaders:{
'X-Authorization-access_token':'e3ae39424a44438d9458c69aeb631cb5'
},
//点击更多跳转的地址
pendingMoreUrl:"http://localhost:9528/#/"
}
}
}
</script>
如果页面直接引用 【推荐该方案】
<template>
<iform-pending-message
:url="pendingUrl"
:headers="pendingHeaders"
:more-url="pendingMoreUrl"
/>
<p/>
<iform-pending-column
:url="pendingUrl"
:headers="pendingHeaders"
:more-url="pendingMoreUrl"
:height="430"
/>
</template>
<script>
import { IformPendingColumn } from 'iform-pending'
import { IformPendingMessage } from 'iform-pending'
export default {
components: {
IformPendingColumn,
IformPendingMessage
},
data () {
return {
//api地址
pendingUrl:"http://192.168.3.230:42000/iform",
//api地址请求头,主要设置token
pendingHeaders:{
'X-Authorization-access_token':'e3ae39424a44438d9458c69aeb631cb5'
},
//点击更多跳转的地址
pendingMoreUrl:"http://localhost:9528/#/"
}
}
}
</script>
iform-pending-column 配置说明:
属性 Attributes
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
url | api地址 | String | - |
headers | api地址请求头,主要设置token | Object | - |
more-url | 点击更多和栏目的跳转地址 | String | - |
height | 栏目的高度 | Number | 400 |
limit | 栏目的显示条数 | Number | 20 |
iform-pending-message 配置说明:
属性 Attributes
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
url | api地址 | String | - |
headers | api地址请求头,主要设置token | Object | - |
more-url | 点击更多和栏目的跳转地址 | String | - |
limit | 栏目的显示条数 | Number | 3 |
插槽 Slots
name | 说明 | ||
---|---|---|---|
icon | 图标插槽 | String | - |
1.0.2
5 months ago