学习小程序框架 taro
Taro
https://taro-docs.jd.com/taro/docs/GETTING-STARTED.html
Taro-ui
https://taro-ui.jd.com/#/docs/quickstart
$ npm install -g @tarojs/cli
$ yarn global add @tarojs/cli
$ cnpm install -g @tarojs/cli
taro init myApp
$ yarn dev:weapp
$ yarn build:weapp
$ yarn dev:h5
$ yarn build:h5
A.弹框中有原生组件(Input,Textarea)时,若设置了placeholder会直接显示在页面上(Android会出现)并且点击会唤起输入框。解决方法:根据是否显示弹框变量 来判断是否渲染弹框中的原生组件
<AtModal
isOpened={isOpened}
closeOnClickOverlay={false}
>
<AtModalHeader>{title}</AtModalHeader>
<AtModalContent>
{
// 这里判断是因为modal里面有textarea placeholder会直接显示在页面上
isOpened ? <AtTextarea
fixed={true}
value={value}
height={200}
onChange={this.handleChange.bind(this)}
maxLength={200}
placeholder='请输入回复内容...' /> : null
}
</AtModalContent>
<AtModalAction>
<Button onClick={this.handleCancel.bind(this)}>取消</Button>
<Button onClick={this.handleOk.bind(this)}>确定</Button>
</AtModalAction>
</AtModal>
header: {
'content-type': 'application/json'
}
export function postJSON(url, data) {
Taro.showLoading();
return Taro.request({
url,
data,
method: "POST",
header: {
'content-type': 'application/json'
}
}).finally(() => {
Taro.hideLoading();
});
}
Taro.navigateTo({
url: "/pages/detail/index?topicId=" + id,
});
Taro.redirectTo({
url: "/pages/detail/index?topicId=" + id,
});
navigateTo ===> push
redirectTo ===> replace
Taro.navigateBack(); 返回
<Image className="login-bg" src={require('../../assets/img/login_bg.jpg')} />