小编Har*_*uja的帖子

理解redux中的compose函数

我正在尝试使用以下语法在redux中创建一个商店: -

const middlewares = [
  thunk,
  logger
]

const wlStore = createStore(
  rootReducer,
  initialState
  compose(applyMiddleware(...middlewares))
)
Run Code Online (Sandbox Code Playgroud)

以上工作对我来说很好,我可以访问商店,但最近我碰到了另一种语法: -

const wlStore=applyMiddleware(thunk,logger)(createStore)(rootReducer)
Run Code Online (Sandbox Code Playgroud)

他们俩似乎都在做同样的工作.

有什么理由因为我更喜欢一个而不是另一个吗?优点缺点?

redux react-redux

50
推荐指数
1
解决办法
3万
查看次数

如何在React.js中更新元标记?

我正在使用react.js中的单页应用程序,那么在页面转换或浏览器后退/前进上更新元标记的最佳方法是什么?

reactjs

24
推荐指数
7
解决办法
4万
查看次数

如何在React Native中自动打开键盘?

我的React Native应用程序中有一个屏幕,其中我有几个文本字段.

我想知道是否有任何方式在屏幕上加载我的关键字自动打开并关注我的第一个文本输入字段?

我正在寻找像stateAlwaysVisibleandroid 这样的东西.

react-native

12
推荐指数
4
解决办法
1万
查看次数

width null在react-native中表示什么?

我在SO和几个应用程序上遇到了几个问题,我遇到了以下样式配置: -

  container: {
    flex:1,
    width: null,
  },
Run Code Online (Sandbox Code Playgroud)

我想知道width:null这里的用途是什么.有人可以帮忙吗?

react-native

9
推荐指数
1
解决办法
2104
查看次数

如何将样式映射到React Native中的数字?

我正在使用React Native处理移动应用程序.

我创建了一小组样式ReactNative.StyleSheet,并在我的组件中使用它们.

现在我亲眼目睹了一些特殊的东西.我看到我的样式被映射到某个数字.理想情况下,当我尝试打印样式时,我希望有一个对象存在.

以下是我的css: -

const styles = StyleSheet.create({
  container: {
    flex:1,
    alignItems:'center',
    width: null,
  },
  logo: {
    width:110,
    marginTop:84,
    resizeMode:'contain'
  },
  mascot:{
    width:145,
    height:150,
    marginTop:73,
    resizeMode:'contain'
  },
  button:{
    backgroundColor:'#4A90E2',
    width:300,
    alignSelf:'center',
  },
  buttonContainer:{
    marginTop:70
  }
})
Run Code Online (Sandbox Code Playgroud)

console.log(style)告诉我以下.我想知道这些数字是什么?

react-native

9
推荐指数
1
解决办法
732
查看次数

了解flex-grow

我有3个div,如果我给flex: 0.5前两个div,如果我给的话,最后一个div应该移动到下一行flex-wrap: wrap.如果我错了,请纠正.

以下是我的html/css:

.parent {
  display: flex;
  height: 100px;
  background-color: red;
  flex-wrap: wrap;
}
.child-1 {
  background-color: green;
  flex: 0.5;
}
.child-2 {
  background-color: yellow;
  flex: 0.5;
}
.child-3 {
  background-color: pink;
}
Run Code Online (Sandbox Code Playgroud)
<div class="parent">
  <div class="child-1">LOREN IPSUM LOREN IPSUM</div>
  <div class="child-2">LOREN IPSUMLOREN IPSUMLOREN IPSUM</div>
  <div class="child-3">LOREN IPSUMLOREN IPSUM</div>
</div>
Run Code Online (Sandbox Code Playgroud)

请检查JSFiddle.

提前致谢.

html css css3 flexbox flex-grow

8
推荐指数
1
解决办法
2670
查看次数

如何在webpack + reactjs中使用环境变量?

我正在使用webpack编译我的Reactjs文件。在我的项目中,我需要对后端进行API调用。

现在我有3个可以本地化,开发和生产的环境。

所以我有一个constants.jsx文件,其中我声明了以下内容:

export const url= 'http://localhost:8002/api/v0';
Run Code Online (Sandbox Code Playgroud)

因此,在我的组件中,我从上方导入url并使用它们来调用APIS,但是我需要如何根据变量是本地变量,dev变量还是prod变量来更改上面的变量。

我该如何实施?

reactjs webpack react-jsx

6
推荐指数
1
解决办法
4613
查看次数

使用babel-module-resolver从单个文件导出时的循环依赖性问题

我正在研究一个反应本机项目,而执行热重新加载应用程序进入循环递归,导致超出最大调用堆栈.可以在此处找到有关此问题的更多详细信息

从这里我意识到有一些错误,并且正在创建循环依赖.

我决定试试madge,看看项目中发生了什么.运行命令后,我看到了很多循环依赖项.

现在,因为我的项目是非常庞大的调试,这是一个非常重要的任务所以我创建了一个包含单个文件夹的项目的小版本.

我创建了一个utils文件夹,其中有4个文件: -

  1. utils的/ index.js
  2. utils的/设备helper.js
  3. utils的/ init.js
  4. index.js

对于我正在使用的进口 babel-module-resolver

utils的/ init.js

import {deviceInfo} from "utils";

export const init = () => {
  // initialising app and calling backend API with device info
};
Run Code Online (Sandbox Code Playgroud)

utils的/设备helper.js

import DeviceInfo from "react-native-device-info";

const API_LEVEL = "v0";

export const deviceInfo = () => {
  try {
    return Object.assign({}, {
      apiLevel: API_LEVEL,
      deviceId: DeviceInfo.getUniqueID(),
      device: DeviceInfo.getDeviceName(),
      model: DeviceInfo.getModel(),
      osVersion: DeviceInfo.getSystemVersion(),
      product: DeviceInfo.getBrand(),
      country: DeviceInfo.getDeviceCountry(),
      appVersion: DeviceInfo.getVersion(),
      manufacturer: …
Run Code Online (Sandbox Code Playgroud)

circular-dependency madge react-native

6
推荐指数
1
解决办法
175
查看次数

如何根据文件大小对nodejs中的数组进行排序?

我有一个以文件名作为数组实体的数组。我想根据文件的大小对这个数组进行排序。

例如,

var arr=['index.html','README.md','index.html']; 
Run Code Online (Sandbox Code Playgroud)

所以我目前拥有的是,我创建了一个以文件名作为键和文件大小作为值的对象。

现在我从远程位置获取这些文件,因此我可以从header 中获取文件大小content-length

有没有更好的方法来做到这一点?是否可以在本地执行此操作,我的意思是读取文件大小并基于此创建对象?

javascript node.js

5
推荐指数
1
解决办法
1207
查看次数

如何重新加载组件对url参数更改做出反应?

我有以下路线: -

ReactDOM.render((
     <Router history={browserHistory}>
      <Route path="/" component={app}>
        <IndexRoute component={home}/>
        <Route path="/articles" component={articles} />
        <Route path="/articles/topics/:featureName" component={filteredArticles} />
      </Route>
    </Router>
), document.getElementById('app'));
Run Code Online (Sandbox Code Playgroud)

现在,当我请求/ articles/topics/topic1时,获取的前5个内容正在使用API​​调用.当用户再次到达页面底部时,将进行API调用,其中将获取下5个内容.这工作正常(请注意,handlecroll函数会检查页面底部,其中有一些小问题,所以现在注释掉了.)

现在说我从列表中选择下一个主题,以便更改网址,因此我的网址更改为/ articles/topics/topic2,现在我需要与上面提到的相同的内容并为此主题调用apis.

以下是我目前的组件代码: -

import React from 'react';
import axios from 'axios';
import ArticleList from './ArticleList';
import Banner from './Banner';
import LeftNavBar from './LeftNavBar';
import RightNavbar from './RightNavbar';
import {url} from './Constants';


/*MERGE INTO ARTICLES ONCE SCROLL LOGIC IS FIXED*/
class FilteredArticles extends React.Component{

  constructor(){
    super();
    {/* Adding global event listener,binding it to scroll event and …
Run Code Online (Sandbox Code Playgroud)

reactjs react-router

4
推荐指数
1
解决办法
7118
查看次数