小编sbi*_*nko的帖子
为什么我们需要Redux中的异步流中间件？
根据文档,"没有中间件,Redux商店只支持同步数据流".我不明白为什么会这样.为什么容器组件不能调用异步API,然后调用dispatch操作？
例如,想象一个简单的UI:字段和按钮.当用户按下按钮时,该字段将填充来自远程服务器的数据.
import * as React from 'react';
import * as Redux from 'redux';
import { Provider, connect } from 'react-redux';
const ActionTypes = {
STARTED_UPDATING: 'STARTED_UPDATING',
UPDATED: 'UPDATED'
};
class AsyncApi {
static getFieldValue() {
const promise = new Promise((resolve) => {
setTimeout(() => {
resolve(Math.floor(Math.random() * 100));
}, 1000);
});
return promise;
}
}
class App extends React.Component {
render() {
return (
<div>
<input value={this.props.field}/>
<button disabled={this.props.isWaiting} onClick={this.props.update}>Fetch</button>
{this.props.isWaiting && <div>Waiting...</div>}
</div>
); …推荐指数
解决办法
查看次数
Javascript数组声明:new Array(),new Array(3),['a','b','c']创建行为不同的数组
考虑这个示例Javascript代码:
a = new Array();
a['a1']='foo';
a['a2']='bar';
b = new Array(2);
b['b1']='foo';
b['b2']='bar';
c=['c1','c2','c3'];
console.log(a);
console.log(b);
console.log(c);
Firebug控制台中的结果如下:
对于a('[]'必须通过单击'+'按钮进行扩展):
[]
a1 "foo"
a2 "bar"
对于b:
[undefined, undefined]
对于c:
["c1", "c2", "c3"]
我的问题是:
- 我正确使用数组['key'] ='value'语法吗？
- 为什么数组b没有按预期工作？
- 为什么数组a和c在控制台中的显示方式不同？似乎jQuery无法使用它的.each()方法迭代数组a.
- 你能推荐一些关于Javascript数组行为的好教程吗？
注意: Google Chrome的Firebug仅显示数组'a'的[],但无法展开它.
编辑:好吧,似乎Javascript中的数组只有数字键,因此添加一个字符串作为键名会使一个对象脱离数组.但是为什么jQuery的.each不能用呢？
$.each(a, function ()
{
alert ('derp');
})
附加到脚本的此代码不会生成警报.
推荐指数
解决办法
查看次数
CSS宽度和高度属性的最大像素值是多少？
pxCSS width和height属性接受的最大有效值是多少？
(我目前正在构建一个创建一个非常大的可缩放容器元素的webapp,我想知道实际的限制是什么.)
推荐指数
解决办法
查看次数
如何通过Facebook的Javascript SDK安全地授权用户
我想让用户使用他们的Facebook ID登录我的网站,而无需重新加载页面.这就是我使用Facebook Javascript SDK的原因.此方案使用此SDK描述授权流程:
在流程结束时,我知道用户已登录,我知道他们的Facebook ID.然后我可以通过此ID在我的数据库中注册它们,然后让它们用它来登录.
然而,这似乎非常不安全.为了让我的服务器端脚本知道用户的ID,我必须通过AJAX发送它.但是,我无法知道它是否是ID的所有者谁正在尝试登录.任何人都可以发送带有ID的POST请求(特别是一个获取另一个用户的ID).
我目前的想法是让用户像往常一样通过JS SDK登录,通过AJAX将ID和访问令牌发送到服务器,然后在PHP脚本中使用cURL以确保用户实际登录.
这是要走的路,还是我忽略了更好的选择？
security authorization facebook facebook-javascript-sdk facebook-login
推荐指数
解决办法
查看次数
如何在保持垂直位置的同时使div与父级的右侧对齐？
请参考我绘制的这个方便的图表:
div1的身高不明.div3宽度是流动的; 它永远不应该重叠div2.二者div1并div2具有相同的宽度,并通过在水平方向为中心margin: auto.我如何定位,div3以便在与... 共享垂直位置时与右侧body(无论多宽body)对齐div2？(使用CSS)
推荐指数
解决办法
查看次数
如何获得文本节点的感知样式？
window.getComputedStyle()方法仅接受元素节点.有没有办法可靠地获得确定文本节点的可视化表示的样式？
我意识到节点不能具有style属性,但它们肯定是样式化的,因为它们继承了父元素的样式.或许有一种方法可以从父元素中获取与文本节点的可视化表示相关的所有计算样式吗？
请注意,将节点包装在a中span是不可能的:这会影响CSS规则,例如span:nth-child或span + span等.
推荐指数
解决办法
查看次数
如何加速生成巨大DOM的React render()方法？
该HtmlTable组件
想象一下简单的HtmlTableReact组件.它根据通过dataprop 传递给它的二维数组呈现数据,并且还可以限制通过rowCount和colCount道具的列数和行数.此外,我们需要组件处理大量数据(数万行)而不需要分页.
class HtmlTable extends React.Component {
render() {
var {rowCount, colCount, data} = this.props;
var rows = this.limitData(data, rowCount);
return <table>
<tbody>{rows.map((row, i) => {
var cols = this.limitData(row, colCount);
return <tr key={i}>{cols.map((cell, i) => {
return <td key={i}>{cell}</td>
})}</tr>
})}</tbody>
</table>
}
shouldComponentUpdate() {
return false;
}
limitData(data, limit) {
return limit ? data.slice(0, limit) : data;
}
}
该rowHeights道具
现在我们想让用户更改行高并动态执行.我们添加一个rowHeightsprop,它是行索引到行高的映射:
{
1: …推荐指数
解决办法
查看次数
JQuery:检查元素是否处于正常流程中
使用jQuery检查元素是否在正常流程中的最优雅方法是什么？
根据CSS3规范,
如果符合以下情况,则框属于流程:
其"显示"的使用值为"块","列表项","表格"或模板.
其'float'的使用值为'none'.
其"位置"的使用价值是"静态"或"相对".
它既可以是流根的子节点,也可以是属于流的子节点.
我应该检查所有这些条件,还是有更好的方法？
推荐指数
解决办法
查看次数
传统的前导和CSS线高
CSS规范规定,应通过将指定值除以2并将结果应用于文本行的上方和下方来将行高应用于文本.
这与传统的领先理解有很大不同,这通常意味着间距仅在文本行上方"添加".(我知道这不是100%正确,因为实际行高不会增加空间,而是设置行的高度;但是,通过这种方式描述问题更简单).
考虑这个示例标记:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
p
{
margin:0;
font-size: 13pt;
line-height: 15pt;
}
h1
{
margin:0;
font-size: 21pt;
line-height: 30pt;
}
</style>
</head>
<body>
<h1>Title</h1>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
<p>Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many …推荐指数
解决办法
查看次数
如何让搜索爬虫正确地索引具有无限滚动的页面？
我有一个网站,我实现无限滚动:当用户到达页面的末尾时,进行AJAX调用并将新内容附加到页面底部.但是,这意味着搜索爬虫无法获得第一个"分页符"之后的所有内容.例如,我有一个页面列出了所有带有"infographic"标签的项目.实际上有几十个这样的项目,但是爬虫只能看到前10个,因为其他项目是根据内容相对于浏览器窗口的位置加载的.由于抓取工具没有浏览器窗口,因此根本不会加载新项目.
那么,让搜索爬虫访问具有无限滚动的网页的完整内容,同时还允许用户享受无限滚动和缺乏分页的正确方法是什么？
推荐指数
解决办法
查看次数
标签 统计
css ×5
javascript ×5
html ×2
reactjs ×2
arrays ×1
asynchronous ×1
facebook ×1
height ×1
jquery ×1
performance ×1
positioning ×1
redux ×1
redux-thunk ×1
security ×1
syntax ×1
typography ×1
upperbound ×1
web-crawler ×1
width ×1