小编Kri*_*sna的帖子

I am using react-typescript for my app. For styling I am using Style component. I have decided I will create my custom Hooks Input and Password input. So I first created Input wrapper where I added necessary input fields. After that I have created Password input field. i extended my Password input component props with Input component props. But when I am using Input component wrapper to my password component. I am getting error: This JSX tag's 'children' prop expects …

我在我的应用程序中使用 React-native。我已经命名了我的名字reactamplify。我想将我的应用程序部署到 Google Play 商店。对于自动化部署，我第一次使用fastlane. 我找到了这个文档，按照步骤操作并授予 API访问权限。在我的 React 本机应用程序中，我导航到android文件夹然后运行此命令fastlane init。给出json_key_file我下载的 auth json 文件的路径。但我对包名称感到困惑。我在 vscode 中搜索我的应用程序名称，com.reactamplify将其替换为com.example.todo. 然后运行 ​​android 文件夹fastlane supply init，我收到此错误：[!] Google Api Error: Invalid request - Package not found: com.example.todo.我真的不知道如何修复它:(。真的失去了TBH。

当我跑步时fastlane supply。我得到了这张图片

PS：如果有人给我提供带有图像的示例，那就太棒了

我没有为此应用程序使用 AWS AppSync。我已经创建了 Graphql 模式，我已经制作了自己的解析器。对于每个创建、查询，我都创建了每个 Lambda 函数。我使用了 DynamoDB 单表概念及其全局二级索引。

创建一个 Book 项目对我来说没问题。在 DynamoDB 中，该表如下所示：。

我在返回 Graphql 查询时遇到问题。从 DynamoDB 表获取后Items，我必须使用 Map 函数，然后返回Items基于 Graphql 的表type。我觉得这不是有效的方法。我不知道查询数据的最佳方式。另外，我的作者和作者查询都为空。

这是我的gitlab 分支。

这是我的 Graphql 架构

import { gql } from 'apollo-server-lambda';

const typeDefs = gql`
  enum Genre {
    adventure
    drama
    scifi
  }

  enum Authors {
    AUTHOR
  }

  # Root Query - all the queries supported by the schema

  type Query {
    """
    All Authors query
    """
    authors(author: …

我正在为我的应用程序使用React 本机地图。我有经纬度的餐厅数据。我已经使用 expo location 设置了用户的当前位置（当前位置逻辑不适用于真实设备Simulator or expo's Snack）。我根据餐厅位置对餐厅位置进行排序，latitude and longitude并使用Marker. 根据我的用户当前位置大约 5 公里半径，我想在BottomSheet. 当用户缩小地图时，它会显示更多餐厅选项，并且还会显示在 BottomSheet. 我使用了博览会Geofence逻辑。但是我正在寻找的东西在世博会文档中没有找到。

我在Snack 中共享代码。ps: this will work only ios and android not webView.

这是我的地图代码

   import React, { ReactElement, useEffect, useRef, useState } from 'react';
import {
  Animated, Button, Dimensions, Image, PermissionsAndroid, StatusBar,
  StyleSheet, Text, TouchableOpacity, View

} from 'react-native';


import datas from './components/task.json'; 


import MapView, { Callout, Circle, Marker, …

我创建了一张自定义动画底部表。用户可以上下移动底部滚动条。在我的底部工作表中，我使用了 flatList 来获取数据并将项目呈现为卡片。到目前为止，一切都按预期工作，但我遇到了平面列表滚动问题。在底部工作表内，平面列表不会滚动。我已经制作了硬编码的 height value 2000px，这确实是一种实践，而且 FlatListcontentContainerStyle添加了硬编码的 paddingBottom 2000（也是另一个不好的实践）。我想滚动基于Flex-box. 我不知道如何解决这个问题。

我在expo-snacks上分享我的代码

这是我的全部代码

import React, { useState, useEffect } from "react";
import {
  StyleSheet,
  Text,
  View,
  Dimensions,
  useWindowDimensions,
  SafeAreaView,
  RefreshControl,
  Animated,
  Button,
  FlatList,
} from "react-native";

import MapView from "react-native-maps";
import styled from "styled-components";

import {
  PanGestureHandler,
  PanGestureHandlerGestureEvent,
  TouchableOpacity,
} from "react-native-gesture-handler";

const { width } = Dimensions.get("screen");

const initialRegion = {
  latitudeDelta: 15,
  longitudeDelta: 15,
  latitude: 60.1098678,
  longitude: 24.7385084,
};

const api = …

我制作了一张自定义动画底部表。它有两个捕捉点。它从屏幕顶部开始，如果向下滚动动画卡，它将出现在屏幕中间，再次向下滚动卡，它将出现在屏幕底部。如果用户用力向下滚动动画卡，那么它将一直滚动到底部。我将此组件制作为可重复使用的组件。

我制作了可重复使用的搜索组件。

我将这两个组件导入到主应用程序组件中。在Animated-Bottom-sheet内，我放置了Search-component。

我已经为键盘和Animated.View设定了条件

• 如果动画视图从屏幕中部移动到底部并搜索onFocus（键盘出现），则键盘将消失。

• 如果动画视图位于屏幕底部并且搜索输入onfocus（出现键盘），则它将移动动画视图到屏幕中间。为了这个逻辑，我做了Keyboard.addListener('keyboardDidHide',()=>{....})

我的这个逻辑在 IOS 中完美运行，但在 Android 中，它将所有元素推到屏幕顶部。

有很多关于 KeyboardAvoidingView 的建议，但就我而言，它不起作用。

在react-native的android的AndroidManifest.xml文件中。我做了android:windowSoftInputMode="adjustPan"它，它监听Keyboard.addListener('keyboardDidHide'并将所有元素推到屏幕顶部，如果我做了，android:windowSoftInputMode="adjustPan|adjustResize"那么它不会监听Event-lister。结果，我的逻辑不起作用，它隐藏了 Android 键盘下的动画视图。根据RN-documentation，Event-lister 仅监听adjustResize or adjustPan。

问题：

我真的不知道如何解决这个问题

Android 设备行为

演示版

代码演示

世博小吃

这是我的动画视图组件

import React, { useState } from "react";
import { StyleSheet, Dimensions, Platform, View, Keyboard } from "react-native";
import {
  PanGestureHandler,
  PanGestureHandlerGestureEvent,
} …

我正在为我的应用程序使用apollo-server-lambda。我已经创建了自定义授权 http 标头，这是必需的。如果authoization: LETMEIN那么它会返回 true 并返回所有数据，如果没有任何数据authoization或错误authoization则它将抛出错误。对于本地开发，我使用了serverless-offline。在本地环境中，它按预期工作，这是图像，但是当我将代码部署到 AWS 时，api 端不起作用。它总是向我抛出错误：这是链接。

我测试我的功能 AWS 控制台。我收到此错误：

我不明白我做错了什么。

这是我的代码

/* eslint-disable @typescript-eslint/no-var-requires */
import { ApolloServerPluginLandingPageGraphQLPlayground } from 'apollo-server-core';
import { ApolloServer, AuthenticationError } from 'apollo-server-lambda';
import schema from '../graphql/schema';
import resolvers from '../resolvers';
import runWarm from '../utils/run-warm';

export const authToken = (token: string) => {
  if (token === 'LETMEIN') {
    return;
  } else {
    throw new AuthenticationError('No authorization header supplied'); …

我创建了一个简单的反应来练习 gitlab 的 CI/CD 管道。我有三份CD/CI管道工作。首先测试应用程序，然后构建然后部署到 AWS 的 S3 存储桶。成功通过测试并运行构建生产后，当它进入部署阶段时，我收到此错误：The user-provided path build does not exist.我不知道如何制作路径Gitlab's cd/ci pipeline.

这是我的 gitlab.gitlab-ci.yml文件设置

image: 'node:12'
stages:
  - test
  - build
  - deploy

test:
  stage: test
  script:
    - yarn install
    - yarn run test

variables:
  AWS_ACCESS_KEY_ID: $AWS_ACCESS_KEY_ID
  AWS_SECRET_ACCESS_KEY: $AWS_SECRET_ACCESS_KEY
  AWS_REGION: $AWS_REGION
  S3_BUCKET_NAME: $S3_BUCKET_NAME

build:
  stage: build
  only:
    - master
  script:
    - npm install
    - npm run build

deploy:
  stage: deploy
  only:
    - master
  image: python:latest
  script:
     - pip …

我正在练习 aws lambda 函数和无服务器 yml。我正在使用 typescript 和 javascript es6。我通过离线插件测试我的无服务器 yml 文件。当我导出 lambda 函数并在无服务器 yml 文件中调用它时，如下所示：handler: src/handlers/hello.hello，我的 lambda 触发该函数并且它按预期工作。我正在尝试将我的 lambda 函数作为导出默认函数并像这样调用它handler: src/handlers/hello.default。我收到错误：hello is not a function。我不知道我的导出默认值做错了什么。

这个逻辑有效

import { APIGatewayEvent } from "aws-lambda";

export async function hello(event: APIGatewayEvent) {

  console.log(event);

  try {
    return {
      statusCode: 200,
      body: JSON.stringify("hello emmy"),
    };
  } catch (error) {
    return {
      statusCode: 500,
      body: JSON.stringify(error),
    };
  }

}

此导出默认不起作用

import { APIGatewayEvent } from "aws-lambda";

export default async function hello(event: …

我在 stackoverflow 中看到了很多基于模态的问题，因此它可能看起来与其他 stackover-flow 问题类似，但我正在寻找的设计没有在任何地方找到。这就是我问这个问题的原因。我在设计方面确实是个新手。我喜欢当用户点击图像时 Instagram 模态卡弹出。我认为他们已经使用transform:scale()并且我尝试实现该逻辑，但似乎它不起作用。我希望卡片scale从 1.2 增长到 1。我已经在代码片段中分享了我的代码。如果有人告诉我如何像 Instagram 那样弹出模态卡，我会非常高兴。

const modal = document.getElementById("modal-container");
  const btn = document.getElementById("open-modal-button");
  const span = document.getElementsByClassName("close")[0];

  btn.onclick = function () {
    modal.classList.add("visible");
  };

  span.onclick = function () {
    modal.classList.remove("visible");
  };

  document.body.addEventListener("click", function (event) {
    if (event.target === modal) {
      modal.classList.remove("visible");
    }
  });

.modal {
    position: fixed;
    z-index: 10;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5);
    display: …