提交 b1fffbc9 编写于 作者: fxy060608's avatar fxy060608

wip(app): uni-app-plus

上级 9d602447
......@@ -8,12 +8,203 @@ describe('decode', () => {
decodeActions([
[3, 1, 4],
[3, 2, 4],
[4, 1, 0, -1, { a: {}, t: '' }],
[4, 2, 0, -1, { a: {}, t: '' }],
[
4,
1,
0,
-1,
{
t: '',
},
],
[
4,
2,
0,
-1,
{
t: '',
},
],
[3, 3, 1],
[4, 3, 0, 2, { a: { '.c': 'content' }, t: '123' }],
[
4,
3,
0,
2,
{
a: {
'.e0': 0,
},
t: '跳转二级页面',
},
],
[3, 4, 1],
[4, 4, 0, 2, { a: { '.c': 'title' }, t: '456' }],
[3, 5, 1],
[
4,
5,
4,
-1,
{
a: {
'.e0': 0,
},
t: '123aaaaaaaaaaaa',
},
],
[
4,
4,
0,
2,
{
a: {
'.c': 'content',
'.h0': 'none',
},
},
],
[3, 6, 4],
[3, 7, 4],
[
4,
6,
0,
2,
{
t: '',
},
],
[
4,
7,
0,
2,
{
t: '',
},
],
[3, 8, 1],
[
4,
8,
0,
7,
{
a: {
'.e0': 0,
},
t: '1test...........',
},
],
[3, 9, 1],
[
4,
9,
0,
7,
{
t: '2',
},
],
[3, 10, 1],
[
4,
10,
0,
2,
{
a: {
'.e0': 0,
},
t: 'showModal',
},
],
[3, 11, 1],
[
4,
11,
0,
2,
{
a: {
'.c': 'title',
},
t: '456',
},
],
[3, 12, 1],
[
4,
12,
0,
2,
{
a: {
'.e0': 0,
},
t: '切换hover',
},
],
[3, 13, 1],
[
4,
13,
0,
2,
{
a: {
'.s': {
color: 'red',
},
},
t: 'static style',
},
],
[3, 14, 1],
[
4,
14,
0,
2,
{
a: {
'.s': {
color: 'red',
},
},
t: 'dynamic obj style',
},
],
[3, 15, 1],
[
4,
15,
0,
2,
{
a: {
'.s': {
color: 'black',
},
},
t: 'dynamic array style',
},
],
[3, 16, 1],
[
4,
16,
0,
2,
{
a: {
'.s': 'color:blue',
},
t: 'dynamic string style',
},
],
[2],
]),
{ colors: true, depth: null }
......
......@@ -800,10 +800,15 @@ var serviceContext = (function (vue) {
'OncePassive',
'Passive',
];
/*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -891,10 +891,15 @@
"OncePassive",
"Passive"
];
const ATTR_MAP = /* @__PURE__ */ extend({
const BASE_ATTR_MAP = {
class: ".c",
style: ".s"
}, Object.keys(EVENT_MAP).reduce((res, name) => {
style: ".s",
"hover-class": ".h0",
"hover-stop-propagation": ".h1",
"hover-start-time": ".h2",
"hover-stay-time": ".h3"
};
const ATTR_MAP = /* @__PURE__ */ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......@@ -1918,7 +1923,7 @@
return ret;
}
};
function patchClass(el, value, isSVG) {
function patchClass$1(el, value, isSVG) {
if (value == null) {
value = "";
}
......@@ -1932,7 +1937,7 @@
el.className = value;
}
}
function patchStyle(el, prev, next) {
function patchStyle$1(el, prev, next) {
const style = el.style;
if (!next) {
el.removeAttribute("style");
......@@ -1946,50 +1951,50 @@
}
} else {
for (const key in next) {
setStyle(style, key, next[key]);
setStyle$1(style, key, next[key]);
}
if (prev && !isString(prev)) {
for (const key in prev) {
if (next[key] == null) {
setStyle(style, key, "");
setStyle$1(style, key, "");
}
}
}
}
}
const importantRE = /\s*!important$/;
function setStyle(style, name, val) {
const importantRE$1 = /\s*!important$/;
function setStyle$1(style, name, val) {
if (isArray(val)) {
val.forEach((v) => setStyle(style, name, v));
val.forEach((v) => setStyle$1(style, name, v));
} else {
if (name.startsWith("--")) {
style.setProperty(name, val);
} else {
const prefixed = autoPrefix(style, name);
if (importantRE.test(val)) {
style.setProperty(hyphenate(prefixed), val.replace(importantRE, ""), "important");
const prefixed = autoPrefix$1(style, name);
if (importantRE$1.test(val)) {
style.setProperty(hyphenate(prefixed), val.replace(importantRE$1, ""), "important");
} else {
style[prefixed] = val;
}
}
}
}
const prefixes = ["Webkit", "Moz", "ms"];
const prefixCache = {};
function autoPrefix(style, rawName) {
const cached = prefixCache[rawName];
const prefixes$1 = ["Webkit", "Moz", "ms"];
const prefixCache$1 = {};
function autoPrefix$1(style, rawName) {
const cached = prefixCache$1[rawName];
if (cached) {
return cached;
}
let name = camelize(rawName);
if (name !== "filter" && name in style) {
return prefixCache[rawName] = name;
return prefixCache$1[rawName] = name;
}
name = capitalize(name);
for (let i = 0; i < prefixes.length; i++) {
const prefixed = prefixes[i] + name;
for (let i = 0; i < prefixes$1.length; i++) {
const prefixed = prefixes$1[i] + name;
if (prefixed in style) {
return prefixCache[rawName] = prefixed;
return prefixCache$1[rawName] = prefixed;
}
}
return rawName;
......@@ -2071,7 +2076,7 @@
function removeEventListener(el, event, handler, options) {
el.removeEventListener(event, handler, options);
}
function patchEvent(el, rawName, prevValue, nextValue, instance = null) {
function patchEvent$1(el, rawName, prevValue, nextValue, instance = null) {
const invokers = el._vei || (el._vei = {});
const existingInvoker = invokers[rawName];
if (nextValue && existingInvoker) {
......@@ -2128,15 +2133,15 @@
const patchProp = (el, key, prevValue, nextValue, isSVG = false, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
switch (key) {
case "class":
patchClass(el, nextValue, isSVG);
patchClass$1(el, nextValue, isSVG);
break;
case "style":
patchStyle(el, prevValue, nextValue);
patchStyle$1(el, prevValue, nextValue);
break;
default:
if (isOn(key)) {
if (!isModelListener(key)) {
patchEvent(el, key, prevValue, nextValue, parentComponent);
patchEvent$1(el, key, prevValue, nextValue, parentComponent);
}
} else if (shouldSetAsProp(el, key, nextValue, isSVG)) {
patchDOMProp(el, key, nextValue, prevChildren, parentComponent, parentSuspense, unmountChildren);
......@@ -2618,60 +2623,84 @@
$2.parentNode.removeChild($2);
}
}
class UniElement extends UniNode {
constructor(id, tag) {
super(id, tag);
this._listeners = {};
this.$ = document.createElement(tag);
}
init(nodeJson) {
super.init(nodeJson);
if (hasOwn(nodeJson, "a")) {
this.setAttrs(nodeJson.a);
}
}
setAttrs(attrs2) {
Object.keys(attrs2).forEach((name) => {
this.setAttr(name, attrs2[name]);
});
class UniComment extends UniNode {
constructor(id) {
super(id, "#comment");
this.$ = document.createComment("");
}
setAttr(name, value) {
if (name === ".c") {
this.$.className = value;
} else if (name.indexOf(".e") === 0) {
this.addEvent(name, value);
}
function patchClass(el, clazz) {
el.className = clazz;
}
function patchStyle(el, value) {
const style = el.style;
if (isString(value)) {
if (value === "") {
el.removeAttribute("style");
} else {
this.$.setAttribute(decodeAttr(name), value);
style.cssText = value;
}
} else {
for (const key in value) {
setStyle(style, key, value[key]);
}
}
removeAttr(name) {
if (name === ".c") {
this.$.className = "";
} else if (name.indexOf(".e") === 0) {
this.removeEvent(name);
}
const importantRE = /\s*!important$/;
function setStyle(style, name, val) {
if (isArray(val)) {
val.forEach((v) => setStyle(style, name, v));
} else {
if (name.startsWith("--")) {
style.setProperty(name, val);
} else {
this.$.removeAttribute(decodeAttr(name));
const prefixed = autoPrefix(style, name);
if (importantRE.test(val)) {
style.setProperty(hyphenate(prefixed), val.replace(importantRE, ""), "important");
} else {
style[prefixed] = val;
}
}
}
addEvent(name, flag) {
const [type, options] = parseEventName(decodeAttr(name));
if (this._listeners[type]) {
{
console.error(formatLog(`tag`, this.tag, this.id, "event[" + type + "] already registered"));
}
return;
}
const prefixes = ["Webkit"];
const prefixCache = {};
function autoPrefix(style, rawName) {
const cached = prefixCache[rawName];
if (cached) {
return cached;
}
let name = camelize(rawName);
if (name !== "filter" && name in style) {
return prefixCache[rawName] = name;
}
name = capitalize(name);
for (let i = 0; i < prefixes.length; i++) {
const prefixed = prefixes[i] + name;
if (prefixed in style) {
return prefixCache[rawName] = prefixed;
}
this._listeners[type] = createInvoker(this.id, flag, options);
this.$.addEventListener(type, this._listeners[type], options);
}
removeEvent(name) {
const [type] = parseEventName(decodeAttr(name));
const listener = this._listeners[type];
return rawName;
}
function patchEvent(el, name, flag) {
const [type, options] = parseEventName(decodeAttr(name));
if (flag === -1) {
const listener = el.__listeners[type];
if (listener) {
this.$.removeEventListener(type, listener);
el.removeEventListener(type, listener);
} else {
console.error(formatLog(`tag`, this.tag, this.id, "event[" + type + "] not found"));
console.error(formatLog(`tag`, el.tagName, el.__id, "event[" + type + "] not found"));
}
} else {
if (el.__listeners[type]) {
{
console.error(formatLog(`tag`, el.tagName, el.__id, "event[" + type + "] already registered"));
}
return;
}
el.__listeners[type] = createInvoker(el.__id, flag, options);
el.addEventListener(type, el.__listeners[type], options);
}
}
function createInvoker(id, flag, options) {
......@@ -2698,19 +2727,181 @@
}
return modifiers;
}
class UniElement extends UniNode {
constructor(id, tag) {
super(id, tag);
this.$ = document.createElement(tag);
this.$.__id = id;
this.$.__listeners = Object.create(null);
}
init(nodeJson) {
super.init(nodeJson);
if (hasOwn(nodeJson, "a")) {
this.setAttrs(nodeJson.a);
}
}
setAttrs(attrs2) {
Object.keys(attrs2).forEach((name) => {
this.setAttr(name, attrs2[name]);
});
}
setAttr(name, value) {
if (name === ".c") {
patchClass(this.$, value);
} else if (name === ".s") {
patchStyle(this.$, value);
} else if (name.indexOf(".e") === 0) {
patchEvent(this.$, name, value);
} else {
this.$.setAttribute(decodeAttr(name), value);
}
}
removeAttr(name) {
if (name === ".c") {
patchClass(this.$, "");
} else if (name === ".s") {
patchStyle(this.$, "");
} else if (name.indexOf(".e") === 0) {
patchEvent(this.$, name, -1);
} else {
this.$.removeAttribute(decodeAttr(name));
}
}
}
class UniText extends UniNode {
constructor(id) {
super(id, "#text");
this.$ = document.createTextNode("");
}
}
class UniViewElement extends UniElement {
function isHoverAttr(name) {
return name.indexOf(".h") === 0;
}
class UniHoverElement extends UniElement {
setAttr(name, value) {
if (!isHoverAttr(name)) {
return super.setAttr(name, value);
}
name = camelize(decodeAttr(name));
if (!this._hover) {
this._hover = new Hover(this.$);
}
const { _hover } = this;
_hover[name] = value;
if (name !== "hoverClass") {
return;
}
if (_hover.hoverClass && _hover.hoverClass !== "none") {
_hover.addEvent();
} else {
_hover.removeEvent();
}
}
removeAttr(name) {
if (!isHoverAttr(name)) {
return super.removeAttr(name);
}
}
}
class Hover {
constructor($2) {
this.hoverClass = "none";
this.hoverStopPropagation = false;
this.hoverStartTime = 50;
this.hoverStayTime = 400;
this._listening = false;
this._hovering = false;
this._hoverTouch = false;
this._hoverStartTimer = 0;
this._hoverStayTimer = 0;
this.$ = $2;
this.__hoverTouchStart = this._hoverTouchStart.bind(this);
this.__hoverTouchEnd = this._hoverTouchEnd.bind(this);
this.__hoverTouchCancel = this._hoverTouchCancel.bind(this);
}
get hovering() {
return this._hovering;
}
set hovering(hovering) {
this._hovering = hovering;
if (hovering) {
this.$.classList.add(this.hoverClass);
} else {
this.$.classList.remove(this.hoverClass);
}
}
addEvent() {
if (this._listening) {
return;
}
{
console.log(formatLog(this.$.tagName, "Hover", "addEventListener", this.hoverClass));
}
this._listening = true;
this.$.addEventListener("touchstart", this.__hoverTouchStart);
this.$.addEventListener("touchend", this.__hoverTouchEnd);
this.$.addEventListener("touchcancel", this.__hoverTouchCancel);
}
removeEvent() {
if (!this._listening) {
return;
}
{
console.log(formatLog(this.$.tagName, "Hover", "removeEventListener"));
}
this._listening = false;
this.$.removeEventListener("touchstart", this.__hoverTouchStart);
this.$.removeEventListener("touchend", this.__hoverTouchEnd);
this.$.removeEventListener("touchcancel", this.__hoverTouchCancel);
}
_hoverTouchStart(evt) {
if (evt._hoverPropagationStopped) {
return;
}
if (!this.hoverClass || this.hoverClass === "none" || this.$.disabled) {
return;
}
if (evt.touches.length > 1) {
return;
}
if (this.hoverStopPropagation) {
evt._hoverPropagationStopped = true;
}
this._hoverTouch = true;
this._hoverStartTimer = setTimeout(() => {
this.hovering = true;
if (!this._hoverTouch) {
this._hoverReset();
}
}, this.hoverStartTime);
}
_hoverTouchEnd() {
this._hoverTouch = false;
if (this.hovering) {
this._hoverReset();
}
}
_hoverReset() {
requestAnimationFrame(() => {
clearTimeout(this._hoverStayTimer);
this._hoverStayTimer = setTimeout(() => {
this.hovering = false;
}, this.hoverStayTime);
});
}
_hoverTouchCancel() {
this._hoverTouch = false;
this.hovering = false;
clearTimeout(this._hoverStartTimer);
}
}
class UniViewElement extends UniHoverElement {
constructor(id) {
super(id, "uni-view");
}
}
const elements = new Map();
const UniBuiltInComponents = [, UniViewElement, , , UniText];
const UniBuiltInComponents = [, UniViewElement, , , UniText, UniComment];
function createUniComponent(type, id) {
return new UniBuiltInComponents[type](id);
}
......
import { UniNode } from './UniNode'
export class UniComment extends UniNode {
constructor(id: number) {
super(id, '#comment')
this.$ = document.createComment('')
}
}
import { hasOwn } from '@vue/shared'
import { normalizeNativeEvent } from '@dcloudio/uni-core'
import {
decodeAttr,
formatLog,
parseEventName,
UniNodeJSON,
normalizeEventType,
EventModifierFlags,
} from '@dcloudio/uni-shared'
import { withModifiers } from 'vue'
import { VD_SYNC } from '../../../../constants'
import { ACTION_TYPE_EVENT } from '../../../../PageAction'
import { decodeAttr, UniNodeJSON } from '@dcloudio/uni-shared'
import { UniNode } from './UniNode'
import { UniCustomElement } from './utils'
import { patchClass } from './modules/class'
import { patchStyle } from './modules/style'
import { patchEvent } from './modules/events'
export class UniElement extends UniNode {
$: Element
private _listeners: Record<string, (evt: Event) => void> = {}
$: UniCustomElement
constructor(id: number, tag: string) {
super(id, tag)
this.$ = document.createElement(tag)
this.$ = document.createElement(tag) as unknown as UniCustomElement
this.$.__id = id
this.$.__listeners = Object.create(null)
}
init(nodeJson: Partial<UniNodeJSON>) {
super.init(nodeJson)
......@@ -33,79 +28,24 @@ export class UniElement extends UniNode {
}
setAttr(name: string, value: unknown) {
if (name === '.c') {
this.$.className = value as string
patchClass(this.$, value as string)
} else if (name === '.s') {
patchStyle(this.$, value as string | Record<string, any>)
} else if (name.indexOf('.e') === 0) {
this.addEvent(name, value as number)
patchEvent(this.$, name, value as number)
} else {
this.$.setAttribute(decodeAttr(name), value as string)
}
}
removeAttr(name: string) {
if (name === '.c') {
this.$.className = ''
patchClass(this.$, '')
} else if (name === '.s') {
patchStyle(this.$, '')
} else if (name.indexOf('.e') === 0) {
this.removeEvent(name)
patchEvent(this.$, name, -1)
} else {
this.$.removeAttribute(decodeAttr(name))
}
}
addEvent(name: string, flag: number) {
const [type, options] = parseEventName(decodeAttr(name))
if (this._listeners[type]) {
if (__DEV__) {
console.error(
formatLog(
`tag`,
this.tag,
this.id,
'event[' + type + '] already registered'
)
)
}
return
}
this._listeners[type] = createInvoker(this.id, flag, options)
this.$.addEventListener(type, this._listeners[type], options)
}
removeEvent(name: string) {
const [type] = parseEventName(decodeAttr(name))
const listener = this._listeners[type]
if (listener) {
this.$.removeEventListener(type, listener)
} else if (__DEV__) {
console.error(
formatLog(`tag`, this.tag, this.id, 'event[' + type + '] not found')
)
}
}
}
function createInvoker(
id: number,
flag: number,
options?: AddEventListenerOptions
) {
const invoker = (evt: Event) => {
const event = normalizeNativeEvent(evt)
;(event as any).type = normalizeEventType(evt.type, options)
UniViewJSBridge.publishHandler(VD_SYNC, [[ACTION_TYPE_EVENT, id, event]])
}
if (!flag) {
return invoker
}
return withModifiers(invoker, resolveModifier(flag))
}
function resolveModifier(flag: number) {
const modifiers: string[] = []
if (flag & EventModifierFlags.prevent) {
modifiers.push('prevent')
}
if (flag & EventModifierFlags.self) {
modifiers.push('self')
}
if (flag & EventModifierFlags.stop) {
modifiers.push('stop')
}
return modifiers
}
import { camelize } from '@vue/shared'
import { decodeAttr, formatLog } from '@dcloudio/uni-shared'
import { UniElement } from './UniElement'
function isHoverAttr(name: string) {
return name.indexOf('.h') === 0
}
export class UniHoverElement extends UniElement {
private _hover?: Hover
setAttr(name: string, value: unknown) {
if (!isHoverAttr(name)) {
return super.setAttr(name, value)
}
name = camelize(decodeAttr(name))
if (!this._hover) {
this._hover = new Hover(this.$)
}
const { _hover } = this
;(_hover as any)[name] = value
if (name !== 'hoverClass') {
return
}
if (_hover.hoverClass && _hover.hoverClass !== 'none') {
_hover.addEvent()
} else {
_hover.removeEvent()
}
}
removeAttr(name: string) {
if (!isHoverAttr(name)) {
return super.removeAttr(name)
}
}
}
class Hover {
private $: Element
hoverClass: string = 'none'
hoverStopPropagation: boolean = false
hoverStartTime: number = 50
hoverStayTime: number = 400
private _listening: boolean = false
private _hovering: boolean = false
private _hoverTouch: boolean = false
private _hoverStartTimer: number = 0
private _hoverStayTimer: number = 0
private __hoverTouchStart!: (evt: Event) => void
private __hoverTouchEnd!: (evt?: Event) => void
private __hoverTouchCancel!: (evt?: Event) => void
constructor($: Element) {
this.$ = $
this.__hoverTouchStart = this._hoverTouchStart.bind(this)
this.__hoverTouchEnd = this._hoverTouchEnd.bind(this)
this.__hoverTouchCancel = this._hoverTouchCancel.bind(this)
}
get hovering() {
return this._hovering
}
set hovering(hovering: boolean) {
this._hovering = hovering
if (hovering) {
this.$.classList.add(this.hoverClass)
} else {
this.$.classList.remove(this.hoverClass)
}
}
addEvent() {
if (this._listening) {
return
}
if (__DEV__) {
console.log(
formatLog(this.$.tagName, 'Hover', 'addEventListener', this.hoverClass)
)
}
this._listening = true
this.$.addEventListener('touchstart', this.__hoverTouchStart)
this.$.addEventListener('touchend', this.__hoverTouchEnd)
this.$.addEventListener('touchcancel', this.__hoverTouchCancel)
}
removeEvent() {
if (!this._listening) {
return
}
if (__DEV__) {
console.log(formatLog(this.$.tagName, 'Hover', 'removeEventListener'))
}
this._listening = false
this.$.removeEventListener('touchstart', this.__hoverTouchStart)
this.$.removeEventListener('touchend', this.__hoverTouchEnd)
this.$.removeEventListener('touchcancel', this.__hoverTouchCancel)
}
_hoverTouchStart(evt: Event) {
if ((evt as any)._hoverPropagationStopped) {
return
}
if (
!this.hoverClass ||
this.hoverClass === 'none' ||
(this.$ as any).disabled
) {
return
}
if ((evt as TouchEvent).touches.length > 1) {
return
}
if (this.hoverStopPropagation) {
;(evt as any)._hoverPropagationStopped = true
}
this._hoverTouch = true
this._hoverStartTimer = setTimeout(() => {
this.hovering = true
if (!this._hoverTouch) {
// 防止在hoverStartTime时间内触发了 touchend 或 touchcancel
this._hoverReset()
}
}, this.hoverStartTime)
}
_hoverTouchEnd() {
this._hoverTouch = false
if (this.hovering) {
this._hoverReset()
}
}
_hoverReset() {
requestAnimationFrame(() => {
clearTimeout(this._hoverStayTimer)
this._hoverStayTimer = setTimeout(() => {
this.hovering = false
}, this.hoverStayTime)
})
}
_hoverTouchCancel() {
this._hoverTouch = false
this.hovering = false
clearTimeout(this._hoverStartTimer)
}
}
......@@ -6,7 +6,7 @@ import { $ } from './utils'
export class UniNode {
id: number
tag: string
$!: Element | Text
$!: Element | Text | Comment
constructor(id: number, tag: string) {
this.id = id
this.tag = tag
......
import { UniElement } from './UniElement'
export class UniViewElement extends UniElement {
import { UniHoverElement } from './UniHoverElement'
export class UniViewElement extends UniHoverElement {
constructor(id: number) {
super(id, 'uni-view')
}
......
export function patchClass(el: Element, clazz: string) {
el.className = clazz
}
import { withModifiers } from 'vue'
import { normalizeNativeEvent } from '@dcloudio/uni-core'
import {
parseEventName,
decodeAttr,
formatLog,
EventModifierFlags,
normalizeEventType,
} from '@dcloudio/uni-shared'
import { VD_SYNC } from '../../../../../constants'
import { ACTION_TYPE_EVENT } from '../../../../../PageAction'
import { UniCustomElement } from '../utils'
export function patchEvent(el: UniCustomElement, name: string, flag: number) {
const [type, options] = parseEventName(decodeAttr(name))
if (flag === -1) {
// remove
const listener = el.__listeners[type]
if (listener) {
el.removeEventListener(type, listener)
} else if (__DEV__) {
console.error(
formatLog(`tag`, el.tagName, el.__id, 'event[' + type + '] not found')
)
}
} else {
// add
if (el.__listeners[type]) {
if (__DEV__) {
console.error(
formatLog(
`tag`,
el.tagName,
el.__id,
'event[' + type + '] already registered'
)
)
}
return
}
el.__listeners[type] = createInvoker(el.__id, flag, options)
el.addEventListener(type, el.__listeners[type], options)
}
}
function createInvoker(
id: number,
flag: number,
options?: AddEventListenerOptions
) {
const invoker = (evt: Event) => {
const event = normalizeNativeEvent(evt)
;(event as any).type = normalizeEventType(evt.type, options)
UniViewJSBridge.publishHandler(VD_SYNC, [[ACTION_TYPE_EVENT, id, event]])
}
if (!flag) {
return invoker
}
return withModifiers(invoker, resolveModifier(flag))
}
function resolveModifier(flag: number) {
const modifiers: string[] = []
if (flag & EventModifierFlags.prevent) {
modifiers.push('prevent')
}
if (flag & EventModifierFlags.self) {
modifiers.push('self')
}
if (flag & EventModifierFlags.stop) {
modifiers.push('stop')
}
return modifiers
}
import { camelize, capitalize, hyphenate, isArray, isString } from '@vue/shared'
export function patchStyle(el: Element, value: string | Record<string, any>) {
const style = (el as HTMLElement).style
if (isString(value)) {
if (value === '') {
el.removeAttribute('style')
} else {
// TODO display
style.cssText = value
}
} else {
for (const key in value) {
setStyle(style, key, value[key])
}
}
}
const importantRE = /\s*!important$/
function setStyle(
style: CSSStyleDeclaration,
name: string,
val: string | string[]
) {
if (isArray(val)) {
val.forEach((v) => setStyle(style, name, v))
} else {
if (name.startsWith('--')) {
// custom property definition
style.setProperty(name, val)
} else {
const prefixed = autoPrefix(style, name)
if (importantRE.test(val)) {
// !important
style.setProperty(
hyphenate(prefixed),
val.replace(importantRE, ''),
'important'
)
} else {
style[prefixed as any] = val
}
}
}
}
// 移动端,仅处理 Webkit
const prefixes = ['Webkit' /*, 'Moz', 'ms'*/]
const prefixCache: Record<string, string> = {}
function autoPrefix(style: CSSStyleDeclaration, rawName: string): string {
const cached = prefixCache[rawName]
if (cached) {
return cached
}
let name = camelize(rawName)
if (name !== 'filter' && name in style) {
return (prefixCache[rawName] = name)
}
name = capitalize(name)
for (let i = 0; i < prefixes.length; i++) {
const prefixed = prefixes[i] + name
if (prefixed in style) {
return (prefixCache[rawName] = prefixed)
}
}
return rawName
}
import { isString } from '@vue/shared'
import { UniComment } from './UniComment'
import { UniElement } from './UniElement'
import { UniText } from './UniText'
import { UniViewElement } from './UniViewElement'
export interface UniCustomElement extends Element {
__id: number
__listeners: Record<string, (evt: Event) => void>
}
const elements = new Map<number, UniElement | UniText>()
const UniBuiltInComponents = [, UniViewElement, , , UniText]
const UniBuiltInComponents = [, UniViewElement, , , UniText, UniComment]
function createUniComponent(type: number, id: number) {
return new UniBuiltInComponents[type]!(id)
......
......@@ -409,10 +409,15 @@ export default function vueFactory(exports) {
onTouchforcechange: '.ee'
};
var OPTIONS = ['Capture', 'CaptureOnce', 'CapturePassive', 'CaptureOncePassive', 'Once', 'OncePassive', 'Passive'];
var ATTR_MAP = /*#__PURE__*/extend$1({
var BASE_ATTR_MAP = {
class: '.c',
style: '.s'
}, Object.keys(EVENT_MAP).reduce(function (res, name) {
style: '.s',
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3'
};
var ATTR_MAP = /*#__PURE__*/extend$1(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce(function (res, name) {
var value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach(function (v, i) {
......@@ -728,10 +733,19 @@ export default function vueFactory(exports) {
key: "toJSON",
value: function toJSON() {
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var res = {
a: this.attributes,
s: this.style.toJSON()
};
var attributes = this.attributes,
style = this.style;
var res = {};
if (Object.keys(attributes).length) {
res.a = attributes;
}
var cssStyle = style.toJSON();
if (cssStyle) {
res.s = cssStyle;
}
if (!opts.attr) {
res.i = this.nodeId;
......@@ -768,12 +782,15 @@ export default function vueFactory(exports) {
key: "toJSON",
value: function toJSON() {
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
return opts.attr ? {
t: this._text
} : {
i: this.nodeId,
t: this._text
};
// 暂时不传递 text 到 view 层,没啥意义,节省点数据量
return opts.attr ? {} : {
i: this.nodeId
}; // return opts.attr
// ? { t: this._text as string }
// : {
// i: this.nodeId!,
// t: this._text as string,
// }
}
}]);
......
......@@ -31,10 +31,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
/*#__PURE__*/ shared.extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ shared.extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -27,10 +27,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
/*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -12,9 +12,9 @@ export function normalizePath(id: string): string {
export const resolveMainPathOnce = once((inputDir: string) => {
const mainTsPath = path.resolve(inputDir, 'main.ts')
if (fs.existsSync(mainTsPath)) {
return mainTsPath
return normalizePath(mainTsPath)
}
return path.resolve(inputDir, 'main.js')
return normalizePath(path.resolve(inputDir, 'main.js'))
})
export function resolveBuiltIn(path: string) {
......
......@@ -261,10 +261,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
/*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -252,10 +252,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
/*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -252,10 +252,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
/*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -255,10 +255,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
/*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -39,10 +39,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
/*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -252,10 +252,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
/*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -252,10 +252,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
/*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
/*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......
......@@ -546,10 +546,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
const ATTR_MAP = /*#__PURE__*/ shared.extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
const ATTR_MAP = /*#__PURE__*/ shared.extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......@@ -777,10 +782,15 @@ class UniBaseNode extends UniNode {
}
}
toJSON(opts = {}) {
const res = {
a: this.attributes,
s: this.style.toJSON(),
};
const { attributes, style } = this;
const res = {};
if (Object.keys(attributes).length) {
res.a = attributes;
}
const cssStyle = style.toJSON();
if (cssStyle) {
res.s = cssStyle;
}
if (!opts.attr) {
res.i = this.nodeId;
res.n = encodeTag(this.nodeName);
......@@ -798,12 +808,18 @@ class UniCommentNode extends UniNode {
this._text = text;
}
toJSON(opts = {}) {
// 暂时不传递 text 到 view 层,没啥意义,节省点数据量
return opts.attr
? { t: this._text }
? {}
: {
i: this.nodeId,
t: this._text,
};
// return opts.attr
// ? { t: this._text as string }
// : {
// i: this.nodeId!,
// t: this._text as string,
// }
}
}
......
......@@ -222,11 +222,9 @@ export declare class UniCommentNode extends UniNode {
toJSON(opts?: {
attr?: boolean;
}): {
t: string;
i?: undefined;
} | {
i: number;
t: string;
};
}
......
......@@ -542,10 +542,15 @@ const OPTIONS = [
'OncePassive',
'Passive',
];
const ATTR_MAP = /*#__PURE__*/ extend({
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
}, Object.keys(EVENT_MAP).reduce((res, name) => {
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
};
const ATTR_MAP = /*#__PURE__*/ extend(BASE_ATTR_MAP, Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name];
res[name] = value;
OPTIONS.forEach((v, i) => {
......@@ -773,10 +778,15 @@ class UniBaseNode extends UniNode {
}
}
toJSON(opts = {}) {
const res = {
a: this.attributes,
s: this.style.toJSON(),
};
const { attributes, style } = this;
const res = {};
if (Object.keys(attributes).length) {
res.a = attributes;
}
const cssStyle = style.toJSON();
if (cssStyle) {
res.s = cssStyle;
}
if (!opts.attr) {
res.i = this.nodeId;
res.n = encodeTag(this.nodeName);
......@@ -794,12 +804,18 @@ class UniCommentNode extends UniNode {
this._text = text;
}
toJSON(opts = {}) {
// 暂时不传递 text 到 view 层,没啥意义,节省点数据量
return opts.attr
? { t: this._text }
? {}
: {
i: this.nodeId,
t: this._text,
};
// return opts.attr
// ? { t: this._text as string }
// : {
// i: this.nodeId!,
// t: this._text as string,
// }
}
}
......
......@@ -7,11 +7,17 @@ export class UniCommentNode extends UniNode {
this._text = text
}
toJSON(opts: { attr?: boolean } = {}) {
// 暂时不传递 text 到 view 层,没啥意义,节省点数据量
return opts.attr
? { t: this._text as string }
? {}
: {
i: this.nodeId!,
t: this._text as string,
}
// return opts.attr
// ? { t: this._text as string }
// : {
// i: this.nodeId!,
// t: this._text as string,
// }
}
}
......@@ -295,9 +295,14 @@ export class UniBaseNode extends UniNode {
}
toJSON(opts: { attr?: boolean; children?: boolean } = {}) {
const res: Partial<UniNodeJSON> = {
a: this.attributes,
s: this.style.toJSON(),
const { attributes, style } = this
const res: Partial<UniNodeJSON> = {}
if (Object.keys(attributes).length) {
res.a = attributes
}
const cssStyle = style.toJSON()
if (cssStyle) {
res.s = cssStyle
}
if (!opts.attr) {
res.i = this.nodeId
......
......@@ -70,11 +70,17 @@ const OPTIONS = [
'Passive',
]
const BASE_ATTR_MAP = {
class: '.c',
style: '.s',
'hover-class': '.h0',
'hover-stop-propagation': '.h1',
'hover-start-time': '.h2',
'hover-stay-time': '.h3',
}
export const ATTR_MAP = /*#__PURE__*/ extend(
{
class: '.c',
style: '.s',
},
BASE_ATTR_MAP,
Object.keys(EVENT_MAP).reduce((res, name) => {
const value = EVENT_MAP[name as keyof typeof EVENT_MAP]
res[name] = value
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册