mobile / YH_RNComponent · Commits

Go to a project

Authored by yoho-js001
Commit 549d4f4bf3d9d05f3dd0042193371c70a2b33cd7 1 parent b4d4560e

Use immutable data in list view.

Inline Side-by-side
Showing 12 changed files with 58 additions and 86 deletions
... ... @@ -25,8 +25,6 @@ export default class List extends Component {
render() {
let resource = this.props.resource;
console.log('xxxxxx');
console.log(resource);
if (!resource) {
return null;
}
... ...
... ... @@ -74,8 +74,10 @@ export default class List extends Component {
}
render() {
let {list,isFetching} = this.props.data.toJS().articles;
if (!list||!list.length) {
let articles = this.props.data.get('articles');
let list = articles.get('list');
let isFetching = articles.get('isFetching');
if (!list||!list.size) {
return null;
}
return (
... ... @@ -84,7 +86,7 @@ export default class List extends Component {
contentContainerStyle={styles.contentContainer}
enableEmptySections={true}
showsVerticalScrollIndicator={false}
dataSource={this.dataSource.cloneWithRows(list)}
dataSource={this.dataSource.cloneWithRows(list.toArray())}
renderRow={this.renderRow}
renderHeader={this.renderHeader}
onEndReached={() => {
... ...
... ... @@ -73,7 +73,7 @@ export default class List extends Component {
url,
share,
id,
} = this.props.resource;
} = this.props.resource.toJS();
let urlAry = url.split('&');
let shareParam = {
title,
... ...
... ... @@ -24,13 +24,12 @@ export default class ProductListCell extends Component {
render() {
let {data, sourceType, rowID, style} = this.props;
let {
url,
title,
publish_time,
browse,
src,
} = data;
let url = data.get('url');
let title = data.get('title');
let publish_time = data.get('publish_time');
let browse = data.get('browse');
let src = data.get('src');
if (browse>10000) {
browse = browse/10000.0;
browse = Math.round(browse*10)/10;
... ...
... ... @@ -55,7 +55,7 @@ export default class Banner extends React.Component {
render() {
let width = this.props.width;
let height = this.props.height;
let data = this.props.data;
let data = this.props.data.toArray();
return (
<Swiper
... ... @@ -70,11 +70,7 @@ export default class Banner extends React.Component {
height={height}
>
{data.map((item, i) => {
let {
src,
url,
} = item;
if (!src) {
if (!item.get('src')) {
return null;
}
return (
... ... @@ -82,10 +78,10 @@ export default class Banner extends React.Component {
key={i}
activeOpacity={1}
onPress={() => {
this.props.onPress && this.props.onPress(url);
this.props.onPress && this.props.onPress(item.get('url'));
}}
>
<SlicedImage source={{uri: src.replace('{width}', width).replace('{height}', height).replace('{mode}',2)}} style={{width, height}}/>
<SlicedImage source={{uri: item.get('src').replace('{width}', width).replace('{height}', height).replace('{mode}',2)}} style={{width, height}}/>
</TouchableOpacity>
);
})}
... ...
... ... @@ -24,11 +24,9 @@ export default class BrandCell extends Component {
}
render() {
let {data}=this.props;
let {
shop_logo,
shops_id,
new_product_num,
} = data;
let shop_logo = data.get('shop_logo');
let shops_id = data.get('shops_id');
let new_product_num = data.get('new_product_num');
shop_logo = shop_logo.replace('{width}', 83).replace('{height}', 34).replace('{mode}',2);
return (
<TouchableOpacity style={styles.container} onPress={()=>{this.props.onPressShop&&this.props.onPressShop(data);}}>
... ...
... ... @@ -102,8 +102,8 @@ export default class NewArrival extends Component {
break;
case 'featured': {
let data = [];
for (var i = 0; i < rowData.length; i++) {
let {src} = rowData[i];
for (var i = 0; i < rowData.toArray().length; i++) {
let src = rowData.toArray()[i].get('src');
if (src) {
src = src.replace('{width}', width).replace('{height}', height).replace('{mode}',2);
data.push(src);
... ... @@ -118,8 +118,8 @@ export default class NewArrival extends Component {
style={styles.carouselSection}
items={data}
onClick={(info) => {
let item = rowData[info.index];
let {url} = item;
let item = rowData.toArray()[info.index];
let url = item.get('url');
this.props.onPressCarouselItem&&this.props.onPressCarouselItem(url);
}}
/>
... ... @@ -130,14 +130,12 @@ export default class NewArrival extends Component {
break;
case 'latest': {
if (this.props.topPart.isFetching) {
if (this.props.topPart.isFetching||!rowData) {
return null;
}
let {
recommend_type,
data,
} = rowData;
let recommend_type = rowData.get('recommend_type');
let data = rowData.get('data');
let paddingLeft = rowID % 2 == 1 ? rowMarginHorizontal / 2 : rowMarginHorizontal;
let customStyle = rowID == 0 || rowID == 1 ? {paddingLeft} : {paddingLeft};
... ... @@ -171,7 +169,7 @@ export default class NewArrival extends Component {
style={[styles.listContainer, customStyle]}
key={'row' + rowID}
rowID={rowID}
data={Immutable.fromJS(rowData)}
data={rowData}
onPressProduct={this.props.onPressProductListProduct}
/>
);
... ... @@ -188,8 +186,6 @@ export default class NewArrival extends Component {
_renderSectionHeader(sectionData, sectionID) {
switch (sectionID) {
case 'latest': {
console.log('aaaaaa');
console.log(sectionData);
let noFilterValue = true;
this.props.filterFactors.map((value, key) => {
if (value) {
... ... @@ -241,23 +237,13 @@ export default class NewArrival extends Component {
recommendForYou,
} = this.props;
let {
topList,
brandList,
featuredList,
} = topPart.toJS();
let {
list,
} = productList.toJS();
let banner = topList&&topList.length?[topList]:[];
let latest = list?list:[0];
let banner = topPart.get('topList')&&topPart.get('topList').size?[topPart.get('topList')]:[];
let latest = productList.get('list')&&productList.get('list').size?productList.get('list').toArray():[0];
let recommend = [];
if (brandList&&brandList.length) {
recommend = [brandList];
if (topPart.get('brandList')&&topPart.get('brandList').size) {
recommend = [topPart.get('brandList')];
}
let featured = featuredList&&featuredList.length?[featuredList]:[];
let featured = topPart.get('featuredList')&&topPart.get('featuredList').size?[topPart.get('featuredList')]:[];
let dataSource = {
banner,
recommend,
... ...
... ... @@ -20,7 +20,7 @@ export default class RecommendCell extends Component {
constructor(props) {
super(props);
this.dataSource = new ListView.DataSource({
rowHasChanged: (r1, r2) => r1 !== r2,
rowHasChanged: (r1, r2) => !Immutable.is(r1, r2),
});
this._renderRow = this._renderRow.bind(this);
}
... ... @@ -45,7 +45,7 @@ export default class RecommendCell extends Component {
<ListView
initialListSize={100}
contentContainerStyle={styles.contentContainer}
dataSource={this.dataSource.cloneWithRows(data)}
dataSource={this.dataSource.cloneWithRows(data.toArray())}
renderRow={this._renderRow}
enableEmptySections={true}
horizontal={true}
... ...
... ... @@ -24,13 +24,11 @@ export default class ProductListCell extends Component {
render() {
let {data, rowID, style} = this.props;
let {
favorite_num,
shop_logo,
shop_name,
new_product_num,
} = data;
let favorite_num = data.get('favorite_num');
let shop_logo = data.get('shop_logo');
let shop_name = data.get('shop_name');
let new_product_num = data.get('new_product_num');
return (
<TouchableOpacity
style={[styles.container, style]}
... ...
... ... @@ -39,40 +39,36 @@ export default class ProductListCell extends Component {
render() {
let {data, recommend_type, style} = this.props;
let tagData = [];
if (recommend_type == 'seasonSort') {
for (var i = 0; i < data.length; i++) {
if (i<8) {
tagData.push(data[i].categoryName)
}
}
}
if (recommend_type == 'hotSearchTerm') {
tagData = data;
}
return (
<TouchableOpacity
style={[styles.container, style]}
activeOpacity={1}
onPress={() => {
this.props.onPressProduct && this.props.onPressProduct(data, rowID);
}}
>
<View>
{this._renderImages()}
<View style={styles.bottomContainer}>
{tagData.map((item, i) => {
{data.toArray().map((item, i) => {
if (i > 7) {
return;
}
let str = '';
if (recommend_type == 'seasonSort') {
str = item.get('categoryName');
}
if (recommend_type == 'hotSearchTerm') {
str = item;
}
return (
<View style={styles.tag} key={i}>
<TouchableOpacity style={styles.button} onPress={()=>{
if (recommend_type == 'seasonSort') {
this.props.onPressCategory&&this.props.onPressCategory(data[i]);
this.props.onPressCategory&&this.props.onPressCategory(item);
}
if (recommend_type == 'hotSearchTerm') {
this.props.onPressHotSearch&&this.props.onPressHotSearch(data[i]);
this.props.onPressHotSearch&&this.props.onPressHotSearch(item);
}
}}>
<Text style={styles.tagName}>{item}</Text>
<Text style={styles.tagName}>{str}</Text>
</TouchableOpacity>
</View>
);
... ...
... ... @@ -73,6 +73,7 @@ class NewArrivalContainer extends Component {
}
_onEndReached() {
console.log('bbbbbbbb');
this.props.actions.getProductList();
}
_onPressProductFilter(value) {
... ... @@ -132,11 +133,9 @@ class NewArrivalContainer extends Component {
}
_onPressCategory(data) {
let {
categoryId,
categoryName,
parentId,
} = data;
let categoryId = data.get('categoryId');
let categoryName = data.get('categoryName');
let parentId = data.get('parentId');
if (!categoryId||!parentId) {
return;
}
... ...
... ... @@ -124,7 +124,7 @@ export function getProductList(reload=false) {
return new NewArrivalService('http://api-test3.yohops.com:9999').fetchProductList(channel, order, page, pageSize, allFilterFactors)
.then(json => {
let payload = parseProductList(json);
payload.endReached = payload.currentPage == payload.pageCount || payload.list.length < pageSize;
payload.endReached = payload.currentPage == payload.pageCount;
if (payload.currentPage > 1) {
let oldList = productList.list.toJS();
... ...