This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0

优化属性监听;修复移除属性导致内存溢出的bug

old
宇天 2019-09-04 20:35:00 +08:00
parent d80b077197
commit 22e12d7f77
8 changed files with 33 additions and 13 deletions

View File

@ -29,6 +29,14 @@ $cd: #62778d #526273 #425064;
transition:$c $t $m; transition:$c $t $m;
} }
@mixin focus1(){
box-shadow: 0 0 2px #88f7df;
}
@mixin focus2(){
box-shadow: 0 0 2px #f3be4d;
}
* { * {
box-sizing: border-box; box-sizing: border-box;
margin: 0;padding: 0; margin: 0;padding: 0;
@ -114,7 +122,7 @@ function mkWCFile({ style, html, js }) {
.replace('unmount()', 'disconnectedCallback()') .replace('unmount()', 'disconnectedCallback()')
.replace( .replace(
'watch() {', 'watch() {',
'attributeChangedCallback(name, old, val) {\nif (old === val) {return}' 'attributeChangedCallback(name, old, val) {\nif (val === null || old === val) {return}'
) )
.replace('adopted()', 'adoptedCallback()') .replace('adopted()', 'adoptedCallback()')

View File

@ -29,6 +29,14 @@ $cd: #62778d #526273 #425064;
transition:$c $t $m; transition:$c $t $m;
} }
@mixin focus1(){
box-shadow: 0 0 2px #88f7df;
}
@mixin focus2(){
box-shadow: 0 0 2px #f3be4d;
}
* { * {
box-sizing: border-box; box-sizing: border-box;
margin: 0;padding: 0; margin: 0;padding: 0;
@ -121,7 +129,7 @@ function mkWCFile({ style, html, js }) {
.replace('unmount()', 'disconnectedCallback()') .replace('unmount()', 'disconnectedCallback()')
.replace( .replace(
'watch() {', 'watch() {',
'attributeChangedCallback(name, old, val) {\nif (old === val) {return}' 'attributeChangedCallback(name, old, val) {\nif (val === null || old === val) {return}'
) )
.replace('adopted()', 'adoptedCallback()') .replace('adopted()', 'adoptedCallback()')

View File

@ -108,6 +108,9 @@
} }
button { button {
background: #fff; background: #fff;
// &:active {
border-color: nth($cp, 3);
// }
} }
} }
@ -234,10 +237,11 @@
} }
:host(:focus-within) { :host(:focus-within) {
box-shadow: 0 0 3px nth($ct, 1); @include focus1;
} }
:host(:focus-within[disabled]) { :host(:focus-within[disabled]),
box-shadow: 0 0 3px nth($co, 1); :host(:focus-within[loading]) {
box-shadow: none;
} }
</style> </style>

View File

@ -152,10 +152,10 @@ li {
opacity: 0.6; opacity: 0.6;
} }
:host(:focus-within) { :host(:focus-within) {
box-shadow: 0 0 3px nth($ct, 1); @include focus1;
} }
:host(:focus-within[readonly]) { :host(:focus-within[readonly]) {
box-shadow: 0 0 3px nth($co, 1); @include focus2;
} }
:host([type='textarea']) { :host([type='textarea']) {

View File

@ -166,10 +166,10 @@
opacity: 0.6; opacity: 0.6;
} }
:host(:focus-within) { :host(:focus-within) {
box-shadow: 0 0 3px nth($ct, 1); @include focus1;
} }
:host(:focus-within[readonly]) { :host(:focus-within[readonly]) {
box-shadow: 0 0 3px nth($co, 1); @include focus2;
} }
/* 额外样式 */ /* 额外样式 */

View File

@ -124,8 +124,8 @@ export default class Icon {
watch() { watch() {
switch (name) { switch (name) {
case 'is': case 'is':
this.props.is = val
if (val) { if (val) {
this.props.is = val
this.drawPath() this.drawPath()
} else { } else {
this.removeAttribute('is') this.removeAttribute('is')

View File

@ -163,7 +163,7 @@
} }
&:focus { &:focus {
box-shadow: 0 0 3px nth($ct, 1); @include focus1;
} }
&:last-child { &:last-child {

View File

@ -208,10 +208,10 @@
} }
:host(:focus-within) { :host(:focus-within) {
box-shadow: 0 0 3px nth($ct, 1); @include focus1;
} }
:host(:focus-within[readonly]) { :host(:focus-within[readonly]) {
box-shadow: 0 0 3px nth($co, 1); @include focus2;
} }
:host([disabled]) { :host([disabled]) {
opacity: 0.6; opacity: 0.6;