使用trao trao-ui 的历程

修改trao-ui组件中的默认样式

搜索组件中我不想要搜索按钮

<AtSearchBar value={this.state.value}onChange={this.handleChange}className="searchNoBtn"

然后再全局样式中添加：我的就在app.less文件

.searchNoBtn {.at-search-bar__action {display: none !important;}
}

不能用函数组件 会提示react undefined

 const renderLabel = (list) => {return list.map(v => {return (<AtTag>{v}</AtTag>)})};

这么写会报错。
可以直接在class 里面对数组进行map

<View className="panel-main">
{historyList.map((item, i) => {return AtTag>})
}
View>

使用图片

直接将相对路径放在src属性中，不起作用，
需要先import进来，最好把图片放到服务器上，然后直接写http路径

错误写法：

<Image src="./images/front.png" />

正确写法:

import namedPng from './images/front.png'
...

当进入页面就请求数据

componentDidShow 对应微信小程序的 onShow 方法。

taro里面没有this.props.history属性。

参考文章

部分页面加载动画

this.state.loading ?  : null

官网

切换tab

使用navigateTo和redirectTo会报错navigateTo:fail can not navigateTo a tabbar page

Taro.switchTab({url: '/pages/index/index',
})

ScrollView 微信小程序横向滚动

View不换行问题。横向滚动需要添加：

1. 属性scrollX
2. 父元素设置white-space: nowrap
3. 子元素设置display: inline-block

<ScrollViewclassName='scrollview'scrollX><View className="scroll-item item-a">AView><View className="scroll-item item-b">BView>
ScrollView><style>
.scrollview {height: 200px;white-space: nowrap;.scroll-item {display: inline-block;width: 550px;height: 200px;}.item-a {background-color: red;}.item-b {background-color: black;}}
style>

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！