提交 317b0f80 编写于 作者: KK's avatar KK

zk——开关部件调整

上级 2424ce36
.dropdown-list{ .app-switch{
.el-switch__core{
margin-right: 8px;
}
} }
\ No newline at end of file
<template> <template>
<el-switch v-model="curValue" :disabled ="disabled"></el-switch> <div class="app-switch">
<el-switch v-model="curValue" :disabled ="disabled"></el-switch><span v-if="isShowText">{{text}}</span>
</div>
</template> </template>
<script lang="ts"> <script lang="ts">
...@@ -16,6 +19,22 @@ export default class AppSwitch extends Vue { ...@@ -16,6 +19,22 @@ export default class AppSwitch extends Vue {
*/ */
@Prop() public value?: any; @Prop() public value?: any;
/**
* checked显示文本
*
* @type {boolean}
* @memberof Appswitch
*/
public text:string = "";
/**
* 是否显示文本
*
* @type {boolean}
* @memberof Appswitch
*/
@Prop() public isShowText?: boolean;
get curValue(){ get curValue(){
return this.value == 1 ? true:false; return this.value == 1 ? true:false;
} }
...@@ -23,6 +42,7 @@ export default class AppSwitch extends Vue { ...@@ -23,6 +42,7 @@ export default class AppSwitch extends Vue {
set curValue(value:any){ set curValue(value:any){
let emitValue = value == true ? 1:0; let emitValue = value == true ? 1:0;
this.$emit('change',emitValue); this.$emit('change',emitValue);
this.valueChange(value);
} }
/** /**
...@@ -33,7 +53,27 @@ export default class AppSwitch extends Vue { ...@@ -33,7 +53,27 @@ export default class AppSwitch extends Vue {
*/ */
@Prop() public disabled?: boolean; @Prop() public disabled?: boolean;
/**
* 生命周期
*
* @memberof Appswitch
*/
mounted(){
this.valueChange(this.curValue);
}
/**
* 文本更新
*
* @memberof Appswitch
*/
public valueChange(value:boolean) {
if(value){
this.text="是"
}else{
this.text="否"
}
}
} }
</script> </script>
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册