小编Mel*_*Mel的帖子

我正在尝试使用一个小吃栏组件，该组件采用 open 和 message 属性，并且可以从应用程序的任何页面显示（将 open 设置为 true）。

据我了解，我应该使用 Context。但我不太确定从哪里开始。

这就是我到目前为止所拥有的

我希望将小吃栏放在最高的父组件上

import { createContext } from 'react';

export const SnackbarContext = createContext({});

 const [snack, setSnack] = useState({
    message: '',
    color: '',
    open: false,
  });

<SnackbarContext.Provider value={{ snack, setSnack }}>
  <Snackbar open={snack.open}>
    <Alert>
      {snack.message}
    </Alert>
  </Snackbar>
  <ViewContainer>
    <Switch>{switchRoutes}</Switch>
  </ViewContainer>
</SnackbarContext.Provider>

并能够从任何子组件调用它

import { SnackbarContext } from 'SnackbarContext';

const { snack, setSnack } = useContext(SnackbarContext);

然后像这样将道具更改为snackbar

setSnack({ message: 'hello', open: true})

我有一个看起来像这样的导航器，我试图将信息传递到它下面的所有选项卡。

import {createMaterialTopTabNavigator} from '@react-navigation/material-top-tabs';


const Tab = createMaterialTopTabNavigator();

      <Tab.Navigator
        swipeEnabled={false}
        initialRouteName="TabMapScreen"
        screenProps={user} // I've tried this
        initialLayout={{width: Dimensions.get('window').width}}
      >
        <Tab.Screen
          name="TabMapScreen"
          component={PostsTab}
        />
        <Tab.Screen
          name="TabMapScreen"
          component={() => <PostsTab props={user} />} // also tried this
        />
      </Tab.Navigator>

直接从导航器将道具传递到屏幕的正确解决方案是什么？

我是 Hooks 新手，并尝试更多地使用它们

当组件安装时，如何获取数据（使用 Apollo）？

我正在尝试在 useEffect 中使用 useQuery，到目前为止我的代码如下所示

const MyComponent = () => {
  const getME = () => {
      const { loading, error, data } = useQuery(ME);
      setMe(data.me) // useState hook
      console.log('query me: ', me);
  };

  useEffect(getME);
  return (<>
  ...
  </>)
}

但这给了我一个错误

Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

编辑：这是查询

import { gql } from '@apollo/client';

export const …

每当按下键盘上的下一个按钮时，我都会尝试将注意力集中在下一个输入字段上。

从 React Native 文档中我了解到我们需要使用 useRef 钩子。但是按照文件

TypeError: null is not an object (evaluating 'filed2.current.focus')

我正在使用所有软件包的最新版本，以及带有打字稿模板的新反应本机应用程序。

这是我到目前为止所拥有的代码：

import React, {useRef} from 'react';

...

  const filed1 = useRef(null);
  const filed2 = useRef(null);

  const onButtonClick = () => {
    filed2.current.focus();
  };

  return (
    <>
      <FormInputPassword
        ref={filed1}
        returnKeyType="next"
        onSubmitEditing={onButtonClick}
        blurOnSubmit={false}
      />
      <FormInputPassword
        ref={filed2}
        returnKeyType="done"
        blurOnSubmit={false}
      />
    </ >
  );

编辑：

function FormInputPassword(props) {
  return (
      <FormInputView>
        <Input {...props} />
      </FormInputView>
  );
}


FormInputPassword.defaultProps = {
  blurOnSubmit: true,
  autoCorrect: false,
  editable: true,
};

我想与我创建的所有新实例共享 GitHub 项目 ssh 密钥对，以便可以 git 克隆并从用户数据文件启动程序，而无需在实例中进行 ssh。

在 GCP 上很容易做到，但不太确定如何在 AWS ec2 实例中做到这一点。

编辑：在 GCP 中，我只需使用在实例之间共享的“秘密管理器”。