我必须从头开始一个新的(web + native)项目(中型应用程序).由于过去几年里有过多的JS框架和实现,我对我平常的堆栈有了第二个疑问.
我一直在前端使用react + redux,后端使用Node和MongoDB通过REST API进行通信.
对于这个新项目,我决定使用React-Native + React Native for Web + Node + PostgreSQL.但是,我想知道我应该使用哪个框架来进行数据获取和状态/存储管理.
到目前为止,redux很适合我.但是,由于JS演变的本质.我对我过去使用过的堆栈持怀疑态度.
如果我使用下面的堆栈,有什么优缺点
React-Native + React-Native-For-Web + Redux + GraphQL + Node + PostgreSQL
React-Native + React-Native-For-Web + Relay + GraphQL + Node + PostgreSQL
React-Native + React-Native-For-Web + Apollo + GraphQL + Node + PostgreSQL
Run Code Online (Sandbox Code Playgroud)
我已经阅读了许多文章,说明使用每个框架的好处,但内容和文章的数量有点可怕.我明白没有正确或错误的答案.但是,很高兴知道上面提到的堆栈很好地记在一起 - 更少的学习曲线,良好的文档,可维护性,更少的变通方法.
建立:
1)OS - Win 8.1
2)WAMP
3)PhpStorm 7.1.3
我已经在Dreamweaver上工作了很长时间,最近我因为功能有限而放弃了它.使用Dreamweaver设置本地环境非常简单,我没有遇到任何问题.所以我安装了PhpStorm认为在我使用DW时以相同的方式运行我的PHP Web应用程序非常容易,但是当我尝试使用其内置的webserver在PhpStorm中运行我的Web应用程序时,我得到了502 Bad Gateway错误,我做的是只需在PhpStorm中导入文件夹(位于www目录中)并尝试在浏览器上运行它,但我无法让它在本地工作.我相信我必须在设置下设置Interpreter,但我该如何继续,我应该包括什么?
当我使用WAMP运行我的webapp时,URL看起来像
http://localhost/appname/trunk/public/
Run Code Online (Sandbox Code Playgroud)
当我使用PhpStorm内置的webserver运行它时,URL看起来像
http://localhost:63342/appname/trunk/public/
Run Code Online (Sandbox Code Playgroud)
错误:502坏网关.
我现在很困惑.
我从Apple网站下载了新的Xcode 9版本
https://developer.apple.com/xcode/
但是,我在解压缩文件时收到以下错误
这是可下载文件的已知问题,还是我需要执行其他操作才能解压缩xip文件.
我的Mac配置
High Sierra
System Version: macOS 10.13 (17A352a)
Kernel Version: Darwin 17.0.0
Run Code Online (Sandbox Code Playgroud) 我基本上是在重构我的React组件以支持新的无状态功能组件React功能组件.但是,我对if-else功能组件中的语法感到困惑.
旧代码(工作正常):它的作用主要是查找用户当前是否已登录.如果是,则重定向到主页,否则重定向到登录页面.CurrentUser组件返回一个prop currentUser并检查当前状态
import React, {Component} from "react";
import currentUser from "shared/components/CurrentUser";
import Home from "../Home";
import Landing from "../Landing";
class DefaultRouteHandler extends Component {
render() {
if (!this.props.currentUser) {
return (<Landing />);
} else {
return (<Home />);
}
}
}
export default currentUser(DefaultRouteHandler);
Run Code Online (Sandbox Code Playgroud)
新代码:现在,else如果currentUser的状态为false ,我应该如何检查条件.正如您现在所看到的,它将始终返回主页.
import React from "react";
import currentUser from "shared/components/CurrentUser";
import Home from "../Home";
import Landing from "../Landing";
const DefaultRouteHandler = ({currentUser}) => (
<Home />
);
export …Run Code Online (Sandbox Code Playgroud) 我不敢相信我是第一次遇到这个问题.关于同样的问题,我在SO上搜索了很多其他类似的问题,但是没有一个能为我工作.
我在锚标记下有一个带有class属性的img标记.
所以我的HTML看起来像:
<ul id="racing-menu" class="accordion-menu list-unstyled">
<li>
<a id"something" name class"something">
<img class="icon_71">
</a>
</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
CSS
.icon_71 {
background: url(../../cms/images/sports/something.png) no-repeat;
width: 36px;
height: 22px;
margin: 0 10px 0 0;
float: left;
}
Run Code Online (Sandbox Code Playgroud)
我尝试了以下解决方案,以避免Chrome浏览器上的默认边框
1)border:0 2)outline:none 3)将img类更改为img id
4)设置
a img {
border:none
}
a img {
border:0
}
Run Code Online (Sandbox Code Playgroud) 我正在为我的项目使用react-bootstrap,我正在尝试向按钮组件添加自定义bsStyle属性.如果我根据以下链接http://react-bootstrap.github.io/components.html#buttons使用默认引导类,则正确呈现类名.但是,如果我将属性更改为bsStyle='facebook'它渲染btn-undefined
所以简而言之,当我将bsStyle属性传递给react bootstrap中的组时,我无能为力.
这是我的HTML看起来像
<Button id="facebook-btn" bsStyle="facebook" bsSize="large" block>
</Button>
Run Code Online (Sandbox Code Playgroud)
如果我将我的代码更改为
<Button id="facebook-btn" bsStyle="primary" bsSize="large" block>
</Button>
Run Code Online (Sandbox Code Playgroud)
它工作正常,类正确呈现.
这是控制台html日志

升级brew包时出现以下错误
Error: Your Xcode (8.3.3) is too outdated.
Please update to Xcode 9.0 (or delete it).
Xcode can be updated from
https://developer.apple.com/download/more/
Run Code Online (Sandbox Code Playgroud)
由于我使用的是beta osx版本
High Sierra
System Version: macOS 10.13
Kernel Version: Darwin 17.0.0
Run Code Online (Sandbox Code Playgroud)
似乎我必须升级beta Xcode版本(Xcode 9),我已经从苹果网站https://developer.apple.com/xcode/成功下载并安装了该版本.
现在,我的问题是如何在我的mac上切换Xcode版本,以便brew命令使用新安装的Xcode.
当我运行时,xcodebuild -version我得到以下输出(从App商店安装)
Xcode 8.3.3
Build version 8E3004b
Run Code Online (Sandbox Code Playgroud)
而我下载的测试版是从苹果网站上直接显示的 9.0 beta 6
我有一个innerJoin对 2 个表执行操作的 SQL 查询。
查询根据user_id键返回所有匹配的行
async getUser(id) {
return camelizeKeys(
await knex
.select(
'u.id',
'u.first_name',
'u.last_name',
'u.username',
'u.image_url',
'u.is_admin',
'u.phone',
'u.info',
'la.email'
)
.from('user AS u')
.leftJoin('local_auth AS la', 'la.user_id', 'u.id')
.where('u.id', '=', id)
.first()
);
}
Run Code Online (Sandbox Code Playgroud)
现在,我要做的是修改上面的查询,使其对 3 个表执行连接操作。
还有一个叫做 的表customer_user,它user_id作为外键之一。如何customer_user基于user_id. 我想执行这样的操作(但当然,由于使用 knex 执行多个连接的方式不正确,以下操作将不起作用)
async getUser(id) {
return camelizeKeys(
await knex
.select(
'u.id',
'u.first_name',
'u.last_name',
'u.username',
'u.image_url',
'u.is_admin',
'u.phone', …Run Code Online (Sandbox Code Playgroud) 我使用以下电话号码验证yup,但升级后出现 TS 错误
"yup": ^0.27.0到"yup": "^0.29.3"
和
"@types/yup": "^0.26.27"到"@types/yup": "^0.29.7"
const ValidationSchema = Yup.object().shape<ICreateUserForm>({
phone: Yup.string()
.required("Required")
.test("countryCode", "Must include country code", (phone?: string) => {
return !!phone && phone.startsWith("+")
})
.test("isValidNumber", "Must be valid phonenumber", (phone?: string) => {
const parsedNumber = !!phone && parsePhoneNumberFromString(phone)
return parsedNumber && parsedNumber.isValid() ? true : false
})
})
Run Code Online (Sandbox Code Playgroud)
错误
No overload matches this call.
Overload 1 of 4, '(name: string, message: TestOptionsMessage<{}, any>, test: TestFunction<string | …Run Code Online (Sandbox Code Playgroud) 我在我的网络应用程序中使用谷歌散点图,它加载文件就绪.我最近做了一些重组,并尝试在不同的引导选项卡中划分页面内容.
如果我在活动选项卡窗格上加载图表,它可以正常工作,图表的宽度,高度参数是正确的.但是,如果我将图形移动到隐藏选项卡,则图形无法正确加载函数传递的参数(特别是宽度和高度).目前我正在调用文档中的图表.
这是我的代码
HTML
<div class="layout layout-stack-sm layout-main-right">
<div class="col-sm-3 layout-sidebar">
<div class="col-sm-12">
<ul id="myTab" class="nav nav-layout-sidebar nav-stacked">
<li class="active">
<a href="#quick-stats" data-toggle="tab">
<i class="fa fa-th"></i>
Quick Stats
</a>
</li>
<li>
<a href="#engagement-graph" data-toggle="tab">
<i class="fa fa-bar-chart-o"></i>
Engagement graph
</a>
</li>
</ul>
</div>
</div> <!-- layout sidebar -->
<div class="col-sm-9 layout-main">
<div class="tab-content stacked-content">
<div class="tab-pane fade in active" id="quick-stats">
Some content
</div>
<div class="tab-pane fade" id="engagement-graph">
<div id="myMoodPage">
<div class="graph" id="graph">
</div>
</div>
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
在文件上加载图表准备好了
<script type="text/javascript" …Run Code Online (Sandbox Code Playgroud) reactjs ×4
javascript ×3
macos ×2
xcode ×2
xcode9beta6 ×2
css ×1
css3 ×1
formik ×1
graphql ×1
homebrew ×1
html ×1
join ×1
jquery ×1
knex.js ×1
localhost ×1
phpstorm ×1
postgresql ×1
react-native ×1
react-router ×1
redux ×1
relayjs ×1
sql ×1
typescript ×1
validation ×1
wamp ×1
yup ×1