小编phi*_*ilk的帖子

如何知道react-router是否可以返回到在反应应用程序中显示后退按钮

似乎没有API方法来检测您是否可以从应用程序中的当前页面返回.可以检查历史长度,但包括前向和后向堆栈.

我只想在用户实际可以返回时显示后退按钮.

html5-history reactjs react-router

11
推荐指数
3
解决办法
1326
查看次数

API请求的redux传奇是否有意义?

我想知道通用请求saga是否有意义?

它将采取REQUEST包含所有信息(如标题,网址,数据)的操作,并将其与自己的标头和基本URL合并.然后fetch是请求,然后put(REQUEST_SUCCEEDED, json)是商店中的json有效负载.

const request = yield take(REQUEST)
const { url, data, headers } = request
try {
  if (request.startAction) {
    yield put(request.startAction)
  }
  const json = yield call(api.fetch, url, data, headers)
  yield put({...request.successAction, json})
} catch (error) {
  yield put({...request.errorAction, error})
}
Run Code Online (Sandbox Code Playgroud)

据我所知,这一次只允许一个请求,所以不是调用API获取函数而是fork更好吗?

access_token一旦在响应头中遇到API,saga也可以负责管理API ,并为所有后续请求保存它.

function getAction(action) {
  if (action) {
    if (typeof action === "string") {
      return { type: action }
    } else {
      return action
    }
  }
} …
Run Code Online (Sandbox Code Playgroud)

reactjs redux redux-saga

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

如何在redux应用程序中处理react-router路由中的无效ID?

我有一条/messages/:id呈现消息的路线.但是,如果id指向不存在的消息,应该在何处以及如何处理?我的组件使用redux绑定到消息:

function mapStateToProps(state, ownProps) {
  return {
    message: state.messages[ownProps.params.id]
  }
}
Run Code Online (Sandbox Code Playgroud)

然后messageundefined在情况下,没有这样的消息存在,该组件必须及时处理,并呈现不同的东西.然而,这似乎膨胀组件,我想也许这应该在路由器中处理?如果没有这样的消息,则不应该允许调用该路由.

有什么想法吗?

javascript reactjs redux

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

在 redux-saga 或 reducer 中处理下载的项目规范化?

我从 remove API 获得的数据不是我的应用程序可以处理的格式。我的传奇下载数据。

谁应该处理规范化?

在使用规范化数据发送成功操作之前,传奇本身?

或者路由器应该在构建新状态之前标准化日期?

编辑我选择在传奇中标准化并保持减速器清洁。它只是用新的活动替换了活动activitiesUpdated

减速机

export default function account(state = ACCOUNT, action) {
  switch (action.type) {
    case "account/LOGIN_SUCCESS":
      const { access_token, user } = action
      return { ...state, user, access_token, authenticated: true, error: "" }
    case "account/LOGOUT_SUCCESS":
      return ACCOUNT
    case "account/LOGIN_ERROR":
      return { ...state, error: action.error }
    case "account/ACTIVITIES_UPDATED":
      return { ...state, activities: action.activities }
    default:
      return state
  }
}
Run Code Online (Sandbox Code Playgroud)

这些是传奇:

function sortActivities(activities) {
  return action.activities.sort((a,b) => b.timestamp.localeCompare(a.timestamp))
}

function addInvoices(activities) {
  let …
Run Code Online (Sandbox Code Playgroud)

reactjs redux redux-saga

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

即使在速度较慢的计算机上,也可以使用 CanvasCaptureMediaStream 以恒定 fps 进行录制

我想以<canvas>特定的帧速率从 HTML元素录制视频。

我正在使用 CanvasCaptureMediaStreamcanvas.captureStream(fps)并且还可以通过访问视频轨道,const track = stream.getVideoTracks()[0]因此我创建track.requestFrame()以通过MediaRecorder.

我想一次精确地捕捉一帧,然后更改画布内容。更改画布内容可能需要一些时间(因为需要加载图像等)。所以我无法实时捕捉画布。画布上的一些变化会在 500 毫秒内实时发生,因此这也需要调整以一次渲染一帧。

html5-canvas

5
推荐指数
2
解决办法
2472
查看次数

shouldComponentUpdate是否会阻止已连接的子级进行更新

假设我有一个渲染的组件,children但这些子组件可以redux连接或基于计时器更新组件.父组件不知道这一点.然而,父组件实现shouldComponentUpdate了性能优化.

class Container extends React.Component {
  shouldComponentUpdate(nextProps, nextState) { return shallowCompare(this, nextProps, nextState) } 

  render() {
     return <div>
       <h1>{this.props.title}</h1>
       { children }
     </div>
  }
}
Run Code Online (Sandbox Code Playgroud)

可以说,Clock是一个自我更新/连接的组件.而在这个星座:

<Container title="Current Time">
  <Clock/>
</Container>
Run Code Online (Sandbox Code Playgroud)

Clock当它的属性变化,由于仍然可以更新redux状态变化或内部超时(但它的实现),尽管它的父组件title从未改变,因此componentShouldUpdate调用返回false

reactjs redux

2
推荐指数
1
解决办法
2846
查看次数

反应导航 useLinkTo 屏幕外部但在 NavigationContainer 内部

我感到惊讶的是useLinkTo,类似的 ( useNavigation) 只能在导航器屏幕内使用,而它们真正需要的只是NavigationContainer.

因为我的场景是一个包装整个应用程序的通知系统,其通知应该能够链接到应用程序中的其他部分。

<NavigationContainer linking={linking}>
  <Notifications>
    <RootStack/>
  </Notifications>
</NavigationContainer>
Run Code Online (Sandbox Code Playgroud)

现在它位于RootStack像这样的钩子之外useLinkTouseNavigation不起作用并抱怨缺少上下文:

“找不到导航对象。您的组件是否位于导航器的屏幕内?”

是否有使用裸露导航容器(参考)进行深度链接的解决方法?

我尝试将Notifications提供者移至内部RootStack,但这没有帮助。

react-native react-navigation react-navigation-v5

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