{"id":14974281,"url":"https://github.com/duf1991/dyfbuyapp","last_synced_at":"2025-04-30T22:41:00.589Z","repository":{"id":57336658,"uuid":"157168946","full_name":"duf1991/DYFBuyApp","owner":"duf1991","description":"我的第一个react-native学习成果，欢迎各位大佬star和issue!👏👏","archived":false,"fork":false,"pushed_at":"2019-03-15T03:12:20.000Z","size":23072,"stargazers_count":182,"open_issues_count":7,"forks_count":59,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-01-10T01:14:22.127Z","etag":null,"topics":["buyapp","react-native","react-native-app"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/duf1991.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-11-12T06:50:19.000Z","updated_at":"2024-07-08T16:14:44.000Z","dependencies_parsed_at":"2022-09-11T04:00:54.613Z","dependency_job_id":null,"html_url":"https://github.com/duf1991/DYFBuyApp","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/duf1991%2FDYFBuyApp","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/duf1991%2FDYFBuyApp/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/duf1991%2FDYFBuyApp/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/duf1991%2FDYFBuyApp/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/duf1991","download_url":"https://codeload.github.com/duf1991/DYFBuyApp/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":233279522,"owners_count":18652172,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["buyapp","react-native","react-native-app"],"created_at":"2024-09-24T13:50:20.194Z","updated_at":"2025-01-10T01:14:39.589Z","avatar_url":"https://github.com/duf1991.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# DYFBuyApp\n我的第一个react-native学习成果，欢迎各位大佬star和issue!👏👏\n\n![CI Status](https://travis-ci.org/duf1991/LPDSliderView.svg?branch=master)\n[![Gitter](https://img.shields.io/gitter/room/nwjs/nw.js.svg)]()\n![](https://img.shields.io/badge/language-javaScript-orange.svg)\n\n\n\n![](http://wx2.sinaimg.cn/mw690/0060lm7Tly1fxfk994xq8j315c07uae8.jpg)\n\n   这个是我从零开始学习react-native的一个学习记录过程，简单易懂，但涵盖功能全面，基本可以算是一个比较完整的电商app了，希望能够给react-native的初学者一些帮助。因为公司刚接手一个新的RN项目，而本人对于RN等跨平台完全没有接触过，甚至没有任何react等前端基础，html,css,javascript也是从未接触，但一直对这方面比较感兴趣，因此正好趁此机会学习了一把，感觉很有成就感，找到了曾经那种从0到1的掌握技能的感觉,整个过程大概顶多一个月时间。虽然RN现在可能没有以前那么火热，但是其跨平台思想还是很值得学习的，比如google新出的flutter其中很多思想与RN大同小异，例如其组件的state控制页面渲染机制等。当然这个项目还有很多功能可以后续慢慢完善的地方，我会持续更新的。\n   如果有好的建议，欢迎指正。\n\n\n## 预览\n\n![RN电商app_1](resource/电商1.gif)\n![RN电商app_1](resource/电商2.gif)\n![RN电商app_1](resource/电商3.gif)\n![RN电商app_1](resource/电商4.gif)\n\n上面是整个app的基本效果，大家简单感受一下～\n\n\n## 示例\n\n1. 利用 `git clone` 命令下载本仓库；\n2. 利用cd 命令切换到 RN工程目录下（即package.json上一级目录），执行`npm install`命令（这一步很重要！）\n3. 随后在RN工程目录下执行`react-native run-ios 或 react-native run-andriod`或者 打开 `LPDSliderView.xcworkspace 或者 安卓工程` 编译即可。\n\n\n## 需求\n\nXCode 9.0+\n\n## 安装\n\n```\nnpm install react-native-dyfbuyapp --save\n```\n\n## 使用\n\n```\n大家可以根据自己的业务需要自行扩展即可～\n\n主要结构如下\nvar Main = React.createClass({\n    getInitialState() {\n        return {\n            selectedTab: 'home'\n        }\n    },\n\n    render() {\n        return (\n            \u003cTabNavigator tabBarStyle={styles.tabBarStyle}\u003e\n                {/* --首页-- */}\n                {this.renderTabNavigatorItem('首页','account-balance','account-balance','home', '首页', Home)}\n                {/* --商家-- */}\n                {this.renderTabNavigatorItem('商家','store','store','shop', '商家', Shop)}\n                {/* --我的-- */}\n                {this.renderTabNavigatorItem('我的','account-circle','account-circle','mine', '我的', Mine)}\n                {/* --更多-- */}\n                {this.renderTabNavigatorItem('更多','settings','settings','more', '更多', More)}\n            \u003c/TabNavigator\u003e\n\n        )\n\n    },\n\n    renderTabNavigatorItem(title, iconName, selectedIconName, selectedTab, componentName, component) {\n        return (\n            \u003cTabNavigator.Item\n                title={title}\n                renderIcon={() =\u003e \u003cVectorIcon name={iconName} size={25} color={'gray'}\u003e\u003c/VectorIcon\u003e}\n                renderSelectedIcon={() =\u003e \u003cVectorIcon name={selectedIconName} size={25} color={'orange'}\u003e\u003c/VectorIcon\u003e}\n                onPress={() =\u003e { this.setState({ selectedTab: selectedTab }) }}\n                selected={this.state.selectedTab === selectedTab}\n                titleStyle={styles.titleStyle}\n                selectedTitleStyle={styles.selectedStyle}\n            \u003e\n                {/* \u003cHome\u003e\u003c/Home\u003e */}\n                \u003cNavigator\n                    initialRoute={{ name: componentName, component: component }}\n                    configureScene={(route) =\u003e {\n                        return Navigator.SceneConfigs.PushFromRight;\n                    }}\n                    renderScene={(route, navigator) =\u003e {\n                        let Component = route.component;\n                        return \u003cComponent {...route.params} navigator={navigator} /\u003e\n                    }}\n                \u003e\n                \u003c/Navigator\u003e\n\n            \u003c/TabNavigator.Item\u003e\n\n        )\n\n    }\n```\n\n## 作者\n\nDu Yingfeng, yingfeng.du02@ele.me\n\n## 协议\n\nDYFBuyApp 基于 MIT 协议进行分发和使用，更多信息参见协议文件。\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fduf1991%2Fdyfbuyapp","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fduf1991%2Fdyfbuyapp","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fduf1991%2Fdyfbuyapp/lists"}