Button.js
1.55 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
import template from "./Button.html";
import style from "antd/lib/button/style/index.css";
class Button {
useModules = ["esNgAntd"];
props = {
type: String,
size: String,
disabled: Boolean,
ghost: Boolean,
loading: Boolean,
htmlType: String,
};
state = {
disabled: null,
className: "",
};
template = template;
watch = {
loading: (newVal)=> {
if (newVal !== undefined) {
if (newVal === "true") {
this.state.className += " ant-btn-loading";
} else {
this.state.className = this.state.className.replace(
" ant-btn-loading",
""
);
}
}
},
};
constructor() {
esNgAntd.createStyle("ant-btn", style);
let className = ["ant-btn"];
this.state.disabled =
this.props.disabled === "true" ||
this.props.disabled === "disabled";
if (this.props.type) {
className.push("ant-btn-" + this.props.type);
}
if (this.props.size && ["lg", "sm", "xs"].includes(this.props.size)) {
className.push("ant-btn-" + this.props.size);
}
if (this.props.ghost) {
className.push("ant-btn-background-ghost");
}
this.state.className = className.join(" ");
if (this.props.htmlType) {
$element[0].setAttribute("type", this.props.htmlType)
}
}
}