<bst-button/> 按钮组件

<bst-button/>是基于 <el-button/> (opens new window) 组件的二次封装扩展

扩展功能

• 支持设置按钮文本颜色，增加了textColor属性。
• 支持点击按钮发起异步请求，增加了ajax属性。
• 支持点击按钮在发起异步请求之前做二次提醒，增加了twiceHint、hintText属性。
  • 如果是 删除 按钮，支持自动设置二次提醒文本为“您确定要删除吗？"，无需开发者配置提示文案。
• 支持在请求发送之前、请求响应之前和之后对数据进行拦截处理，增加了beforeRequest、beforeResponse、afterResponse属性。

基础使用

查看 上架 下架 删除

代码示例

<template>
  <div>
    <bst-button type="text" textColor="blue">查看</bst-button>
    <bst-button type="text" textColor="green" :ajax="ajax">上架</bst-button>
    <bst-button type="text" textColor="red" :ajax="ajax" twiceHint :hintText="'您确定要下架吗?'">下架</bst-button>
    <bst-button type="text" textColor="red" :ajax="ajax" twiceHint>删除</bst-button>
  </div>
</template>
<script>
	export default {
		name: "index",
		data() {
			return {
				ajax: {
					method: 'get',
					url: './assets/mock/list.json',
				}
			}
		}
	}
</script>

显示代码

属性

支持所有<el-button/> (opens new window)的属性，以下是扩展的属于列表

属性	说明	类型	默认值
textColor	文本颜色 - 可选值 [blue,red,green]	String	null
twiceHint	二次提示	Boolean	false
hintText	二次提示文本	String	null
ajax	ajax请求配置	AjaxConfig	null
beforeRequest	请求发送之前的钩子函数	Function	null
beforeResponse	请求响应之前的钩子函数	Function	null
afterResponse	请求响应之后的钩子函数	Function	null

AjaxConfig

属性	说明	类型	默认值
method	请求方法 - 可选值 [get,post]	String	null
url	请求地址	String	null
params	请求方式为get时的请求参数	Object	null
data	请求方式为post时的请求体数据	Object	null

方法

方法名	说明	参数	返回值
-	-	-	-

事件

事件名称	说明
-	-

插槽

name	说明
-	-

编辑此文档 (opens new window)