说我有以下内容:
export const SOME_ACTION = 'SOME_ACTION';
export function someAction() {
return {
type: SOME_ACTION,
}
}
Run Code Online (Sandbox Code Playgroud)
在该动作创建者中,我想访问全局存储状态(所有reducers).这样做更好:
import store from '../store';
export const SOME_ACTION = 'SOME_ACTION';
export function someAction() {
return {
type: SOME_ACTION,
items: store.getState().otherReducer.items,
}
}
Run Code Online (Sandbox Code Playgroud)
或这个:
export const SOME_ACTION = 'SOME_ACTION';
export function someAction() {
return (dispatch, getState) => {
const {items} = getState().otherReducer;
dispatch(anotherAction(items));
}
}
Run Code Online (Sandbox Code Playgroud) 我希望能够使用HTML标记传递文本,如下所示:
<MyComponent text="This is <strong>not</strong> working." />
Run Code Online (Sandbox Code Playgroud)
但是在MyComponent
渲染方法中,当我打印出来时this.props.text
,它会打印出所有内容:
This is <strong>not</strong> working.
Run Code Online (Sandbox Code Playgroud)
有没有办法让React解析HTML并将其正确地转储出去?
这并不像只进行参数化构建那么简单.我已经有了一个特定的构建过程,只要将任何这些分支推送到GitHub,它就会构建和部署:
所以,如果我只是推动develop
并成功构建,我该如何触发手动构建并将其拉出feature/my-new-feature
(不做git push
)?我尝试启用参数化构建,添加一个名为的新字符串branch
,然后添加一个新的分支说明符,*/$branch
.然后我运行了一个构建并设置branch
为feature/my-new-feature
仍然从中拉出来develop
.
我很感激任何帮助!
这个简单的东西应该很容易实现,但是我把头发拉出来是多么复杂.
我想做的就是动画安装和卸载React组件,就是这样.这是我到目前为止所尝试的以及为什么每个解决方案都不起作用:
ReactCSSTransitionGroup
- 我根本不使用CSS类,它是所有JS样式,所以这不起作用.ReactTransitionGroup
- 这个较低级别的API很棒,但它要求你在动画完成时使用回调,所以只使用CSS过渡在这里不起作用.总有动画库,这导致下一点:TransitionMotion
对于我需要的东西来说却非常混乱和过于复杂.left: -10000px
)但我宁愿不去那条路线.我认为它很hacky,我希望卸载我的组件,以便清理它们并且不会使DOM混乱.我想要一些易于实现的东西.在mount上,动画一组样式; 在卸载时,为相同(或另一组)样式设置动画.完成.它还必须在多个平台上具有高性能.
我在这里碰到了一堵砖墙.如果我遗漏了一些东西并且有一个简单的方法可以做到这一点,请告诉我.
我对使用<input>
时如何获取价值感到困惑mount
.以下是我的测试结果:
it('cancels changes when user presses esc', done => {
const wrapper = mount(<EditableText defaultValue="Hello" />);
const input = wrapper.find('input');
console.log(input.render().attr('value'));
input.simulate('focus');
done();
});
Run Code Online (Sandbox Code Playgroud)
控制台打印出来undefined
.但是,如果我稍微修改代码,它的工作原理:
it('cancels changes when user presses esc', done => {
const wrapper = render(<EditableText defaultValue="Hello" />);
const input = wrapper.find('input');
console.log(input.val());
input.simulate('focus');
done();
});
Run Code Online (Sandbox Code Playgroud)
当然,除了input.simulate
我现在使用之外,这条线路都失败render
了.我需要两个都正常工作.我该如何解决?
编辑:
我应该提一下,<EditableText />
不是一个受控组件.但是当我defaultValue
进入时<input />
,它似乎设定了价值.上面的第二个代码块会打印出值,同样如果我在Chrome中检查输入元素并输入$0.value
控制台,它会显示预期值.
我已经尝试过寻找答案,但其中大多数都不在React的背景下,onChange
触发模糊.
在执行各种测试时,我似乎无法分辨这两个事件是如何不同的(当应用于textarea时).任何人都可以对此有所了解吗?
我正在尝试设置一个Lambda函数,该函数会在文件上传到S3存储桶时对其进行处理.我需要一种方法来查看console.log
上传文件时的输出,但我无法弄清楚如何将我的Lambda函数链接到CloudWatch.
我通过查看context
我的日志组/aws/lambda/wavToMp3
和日志流的对象来计算2016/05/23/[$LATEST]hex_code_redacted
.所以我在CloudWatch中创建了该组和流,但没有记录任何内容.
这是我现在已经做了很长时间的方式了:
export default class AttachmentCreator extends Component {
render() {
return <div>
<RaisedButton primary label="Add Attachment" />
</div>
}
}
AttachmentCreator.propTypes = {
id: PropTypes.string,
};
Run Code Online (Sandbox Code Playgroud)
但我看到有人这样做:
export default class AttachmentCreator extends Component {
static propTypes = {
id: PropTypes.string,
};
render() {
return <div>
<RaisedButton primary label="Add Attachment" />
</div>
}
}
Run Code Online (Sandbox Code Playgroud)
事实上,我已经看到人们在构造函数之外设置初始状态.这是好习惯吗?这一直困扰着我,但我记得在某个地方有人说将默认道具设置为静态不是一个好主意的讨论 - 我只是不记得原因.
我在S3存储桶上托管了一个React应用程序.使用yarn build
(这是一个基于create-react-app的应用程序)缩小代码.该build
文件夹看起来像:
build
??? asset-manifest.json
??? favicon.ico
??? images
? ??? map-background.png
? ??? robot-icon.svg
??? index.html
??? js
? ??? fontawesome.js
? ??? packs
? ? ??? brands.js
? ? ??? light.js
? ? ??? regular.js
? ? ??? solid.js
? ??? README.md
??? service-worker.js
??? static
??? css
? ??? main.bf27c1d9.css
? ??? main.bf27c1d9.css.map
??? js
??? main.8d11d7ab.js
??? main.8d11d7ab.js.map
Run Code Online (Sandbox Code Playgroud)
我永远不想index.html
被缓存,因为如果我更新代码(导致十六进制后缀main.*.js
更新),我需要用户下次访问以获取<script src>
更改index.html
以指向更新的代码.
在CloudFront中,我似乎只能排除路径,排除"/"似乎无法正常工作.我得到奇怪的行为,我更改代码,如果我打刷新,我看到它,但如果我退出Chrome和回去,我看到非常过时代码的某些原因.
我不想在每个代码版本上触发失效(通过CodeBuild).还有其他方法吗?我认为,挑战之一是,因为这是使用路由器作出反应的应用程序,我在用错误的文件设置为做一些挂羊头卖狗肉index.html
,并迫使HTTP状态200,而不是403.
我有一个使用ES6模块的Meteor/React项目.我已经使用npm安装了materialize-css,但我不确定如何在我的JSX代码中实际使用Materialize类.我应该从materialize-css导入什么?或者我只需要将CSS包含在我的主index.html文件中?
我主要想要它用于网格系统,因为我将使用material-ui作为实际的UI组件.
reactjs ×6
javascript ×2
amazon-s3 ×1
animation ×1
aws-lambda ×1
class ×1
dom-events ×1
enzyme ×1
git ×1
github ×1
greensock ×1
jenkins ×1
material-ui ×1
materialize ×1
npm ×1
react-motion ×1
redux ×1
unit-testing ×1