Skip to content

Commit

Permalink
feat: 运行时支持事件和样式
Browse files Browse the repository at this point in the history
  • Loading branch information
@canfoo
canfoo committed Sep 6, 2021
1 parent 1c1bf9a commit 6a0e0a5
Show file tree
Hide file tree
Showing 4 changed files with 113 additions and 41 deletions.
12 changes: 5 additions & 7 deletions packages/runtime-core/npm/Container.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,9 @@ export default class Container {
nodes.forEach(node => {
const nodeData = {
type: node.type,
props: node.props,
props: node.props || {},
text: node.text,
id: node.id,
children: []
}
if (node.children) {
Expand All @@ -32,8 +33,9 @@ export default class Container {
}

applyUpdate() {
console.log('this.root', this.root)
const root = this.toJson([this.root])[0]
console.log('root', root)
console.log('json', root)
this.context.setData({ root});
}

Expand All @@ -42,11 +44,7 @@ export default class Container {
}

createCallback(name, fn) {
// this.context[name] = (...args) => {
// return unstable_batchedUpdates(args => {
// return fn(...args);
// }, args);
// };
this.context[name] = fn
}

appendChild(child) {
Expand Down
2 changes: 1 addition & 1 deletion packages/runtime-core/npm/hostConfig.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ function processProps(newProps, node, id) {
for (const propKey of Object.keys(newProps)) {
if (typeof newProps[propKey] === 'function') {
const contextKey = `${REMAX_METHOD}_${id}_${propKey}`;
// node.container.createCallback(contextKey, createCallbackProxy(propKey, node, newProps[propKey]));
node.container.createCallback(contextKey, newProps[propKey]);
props[propKey] = contextKey;
} else if (propKey === 'style') {
props[propKey] = newProps[propKey] || '';
Expand Down
130 changes: 97 additions & 33 deletions packages/runtime-core/template/base.ts
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
export const baseWxml =
`
<template name="TPL">
<block wx:for="{{root.children}}" wx:key="*this">
<block wx:for="{{root.children}}" wx:key="id">
<template is="TPL_1_CONTAINER" data="{{i: item, a: ''}}" />
</block>
</template>
Expand Down Expand Up @@ -29,128 +29,192 @@ export const baseWxml =
<template name="TPL_1_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_2_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_3_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_4_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_5_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_6_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_7_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_8_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_9_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_10_view">
<view>
<block wx:for="{{i.children}}" wx:key="*this">
<view
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</view>
</template>
<template name="TPL_1_button">
<button>
<block wx:for="{{i.children}}" wx:key="*this">
<button
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</button>
</template>
<template name="TPL_2_button">
<button>
<block wx:for="{{i.children}}" wx:key="*this">
<button
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</button>
</template>
<template name="TPL_3_button">
<button>
<block wx:for="{{i.children}}" wx:key="*this">
<button
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</button>
</template>
<template name="TPL_1_text">
<text>
<block wx:for="{{i.children}}" wx:key="*this">
<text
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</text>
</template>
<template name="TPL_2_text">
<text>
<block wx:for="{{i.children}}" wx:key="*this">
<text
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</text>
</template>
<template name="TPL_3_text">
<text>
<block wx:for="{{i.children}}" wx:key="*this">
<text
style="{{i.props.style}}"
class="{{i.props.class}}"
bindtap="{{i.props.bindtap}}"
>
<block wx:for="{{i.children}}" wx:key="id">
<template is="{{'TPL_' + (tid + 1) + '_CONTAINER'}}" data="{{i: item, a: a, tid: tid + 1 }}" />
</block>
</text>
Expand Down
10 changes: 10 additions & 0 deletions packages/runtime-core/transform/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,16 @@ export default function tarnsform(options: TarnsformOption) {
ClassDeclaration(path) {
className = path.node.id.name
},
JSXAttribute (path) {
const node = path.node
const attributeName = node.name.name
if (attributeName === 'className') {
path.node.name.name = 'class'
}
if (attributeName === 'onClick') {
path.node.name.name = 'bindtap'
}
},
ImportDeclaration(path) {
const source = path.node.source.value
if (source === LEO_COMPONENTS_NAME) {
Expand Down

0 comments on commit 6a0e0a5

Please sign in to comment.