Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support on layout #63

Merged
merged 7 commits into from
Apr 20, 2020
Merged

Support on layout #63

merged 7 commits into from
Apr 20, 2020

Conversation

ykforerlang
Copy link
Member

No description provided.

}
}

class B1 extends Component {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

如果将 B1 通过文件导入进来(例如:import B1 from './B1.js')的话,onLayout 事件就不会生效了。
例如:
import B1 from './B1.js'

// B1.js

export default class B1 extends Component {
	state = {
		y: null,
	}

	componentWillUpdate() {
		console.log('更新的时候:B1 componentWillUpdate 应该只打印一次!!!')
	}

	render() {
		return <View
			onLayout={(e) => {
				console.log('B1:', e.nativeEvent.layout)
				this.setState({
					y: e.nativeEvent.layout.y
				})
			}}
		>
			<Text>B1y: {this.state.y}</Text>
		</View>
	}
}

转换成 wxml 后

    <block original="View" class="m-lt" data-parent="{{parentDiuu}}" data-diuu="{{DIUU00001}}" style="{{t.s(DIUU00001style)}}">
			<view class="text">B1y: {{CTDK00001}}</view>
		</block>

因为 alita 在编译过程,会将 B1 通过一个 block 包起来,所以 class="m-lt" 等辅助 onLayout 属性都会打在 block 标签上,这样wx.createSelectorQuery()方法就无效了,所以 import B1 from './B1.js' 且 B1 最外层元素有onLayout 属性的话需要特殊处理下~~

@ykforerlang ykforerlang merged commit e022caa into master Apr 20, 2020
@ykforerlang ykforerlang deleted the supportOnLayout branch April 20, 2020 02:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants