小编Ser*_*ity的帖子

我正在学习本机反应,在所有教程中,我看到ListView每行只使用1个项目.不过我还没有使用过ListView.我只有6个项目必须显示为平面网格,每行2个项目,应该是响应.我知道它是一个基本问题,但我也试过了我的身边,可以在图像中看到

这是我的代码

 renderDeviceEventList() {
    return _.map(this.props.deviceEventOptions, deviceEventOption => (
        <View key={deviceEventOption.id}>
            <Icon
                name={deviceEventOption.icon_name}
                color="#ddd"
                size={30}
                onPress={() =>
                    this.props.selectDeviceEvent(deviceEventOption)
                }
            />
            <Text style={{ color: "#ff4c4c" }}>
                {deviceEventOption.icon_name}
            </Text>
        </View>
    ));
}
render() {
    return (
        <View
            style={{
                flex: 1,
                top: 60,
                flexDirection: "row",
                justifyContent: "space-around",
                flexWrap: "wrap",
                marginBottom: 10
            }}
        >
            {this.renderDeviceEventList()}
        </View>
    );
}

用户可以在他/她点击退出按钮时注销,但如果令牌过期,他/她无法注销,因为在我的应用程序中,令牌在服务器端和前端都使用.当用户单击注销按钮时,如果令牌有效,则清除服务器和浏览器中的令牌.当用户没有注销并且他/她的令牌过期但未在浏览器中清除时,有可能.为了解决这种情况,每次用户访问我的应用程序时如何检查令牌过期,如果令牌过期,请从浏览器中清除令牌？

我尝试在每次用户刷新页面或切换到另一页时在后台观看的saga.我不认为这是一种有效的方式.我认为中间件开始发挥作用.

function* loadInitialActions() {
  var dateNow = new Date();
  console.log(jwtDecode(token).exp < dateNow.getTime() - jwtDecode(token).iat);
  const token =
    JSON.parse(localStorage.getItem("user")) &&
    JSON.parse(localStorage.getItem("user"))["token"];
  if (
    token &&
    jwtDecode(token).exp < dateNow.getTime() - jwtDecode(token).iat
  ) {
    yield put(LOGOUT_SUCCESS);
  }
}

function* initialize() {
  const watcher = yield fork(loadInitialActions);
  yield take([INITIALIZE_ERROR, INITIALIZE_SUCCESS]);
  yield cancel(watcher);
}

function* rootSaga() {
  console.log("rootSaga");
  yield takeLatest(INITIALIZE, initialize);
}

所以我的问题是如果令牌从中间件到期,我如何使用令牌过期逻辑和注销用户？

我已经为我的项目使用了create-react-app.我收到了错误

未捕获的SyntaxError:意外的令牌导出

错误在此代码中

export const ENGLISH = {
  lang: 'en',
  messages: {
      'nav.translatedMessage': 'Social',
  }
};

我尝试安装babel-preset-es2015和babel-preset-stage-0.我还在package.json中包含了babel dict/object

"babel": {
    "presets": [
      "es2015",
      "stage-0"
    ]
  },

我仍然收到错误.

以前我的项目设置是

public
.next
src
   pages
   components
   assets
next.config.js

这工作正常，但我将结构更改为以下

public
src
   client
    next.config.js
    jsconfig.json
    pages
    components
    assets
   server
    index.js

现在这个不起作用了。我收到错误Couldn't find a页面directory. Please create one under the project root

这是我更新的 next.config.js

const withPlugins = require("next-compose-plugins");
const optimizedImages = require("next-optimized-images");
const withPWA = require("next-pwa");

module.exports = withPlugins(
    [optimizedImages],
    [
      withPWA({
        pwa: {
          dest: "public",
        },
      }),
    ],
    {
      distDir: '../../dist/client',
    }
);

对于绝对导入（从“组件/按钮”导入按钮）

jsconfig.json

{
    "compilerOptions": {
      "baseUrl": "client/"
    }
  }

包.json

"scripts": {
    "dev:client": "nextjs src/client",
    "dev:server": …

当我这样做时python manage.py makemigrations,我得到了上述错误,我不确定错误发生在哪里.我看到一些关于这个问题的帖子,但我发现主要是在DateTimeField()函数传递的地方但在我的情况下我使用了auto_now属性而不是一些与datetime相关的函数.

但是,我在类方法中使用了lambda函数,如下所示.

@classmethod
    def get_content_models(cls):
        """
        Return all Package subclasses.
        """
        is_content_model = lambda m: m is not Package and issubclass(m, Package)


def set_helpers(self, context):
    current_package_id = getattr(current_package, "id", None)
    current_parent_id = getattr(current_package, "parent_id", None)
    self.is_current_child = self.parent_id == current_package_id
    self.is_child = self.is_current_child

    def is_c_or_a(package_id):
        parent_id = context.get("_parent_package_ids", {}).get(package_id)
        return self.id == package_id or (parent_id and is_c_or_a(parent_id))
    self.is_current_or_ascendant = lambda: bool(is_c_or_a(current_package_id))

我不清楚这个问题,所以我发布了解原因.以上代码是否创建了该问题？如果是原因,应该做什么呢？

我不知道这个问题究竟在哪里,所以这里是详细介绍models.py of package app因为代码有点大.它没有达到预订模型,所以我只是把包应用程序的代码,在这里

https://gist.github.com/SanskarSans/51d2f287309a97163e680cc38abd3e06

UPDATE

在我的Package模型中,我使用了自定义字段,在该字段中使用了lambda而不是callable函数,这就产生了一个问题.由于模型的长文件,我没有在这里粘贴,我为此道歉.

这就是我所做的 …

我试图通过查看两勺 django 来创建我自己的项目结构。项目结构看起来像这样

. 环境

. 当地的

  .django

  .postgres

。生产

 .django

 .postgres

在本地内部的postgres中，列出了以下项目

POSTGRES_HOST=postgres
POSTGRES_PORT=5432
POSTGRES_DB=marketing
POSTGRES_USER=username
POSTGRES_PASSWORD=password
DATABASE_URL=postgres://username:password@localhost:5432/marketing

设置文件分为 3 部分作为 base.py, local.py and production.py

在 base.py 中，我已将DATABASES密钥配置如下

DATABASES = {
    'default': env.db('DATABASE_URL'),
}

但是我收到一个错误

django.core.exceptions.ImproperlyConfigured：设置 DATABASE_URL 环境变量

虽然，我DATABASE_URL在 .envs/.local/.postgres 中，但我遇到了以上错误。为什么呢？

我formik用于表格。在我的表单中，我需要使用 的概念，FieldArray它是一个嵌套的概念。我无法使用相应的值填充嵌套表单。这是我的做法

const Itinerary = ({ itineraries, push, remove }) => {
  return (
    <>
      <Heading>Itinerary</Heading>
      {itineraries && itineraries.length === 0 && (
        <span
          style={{
            color: theme.color.primary,
            padding: "0 10px",
            cursor: "pointer"
          }}
          onClick={() => push({})}
        >
          +
        </span>
      )}
      {itineraries &&
        itineraries.length > 0 &&
        itineraries.map((day, index) => {
          return (
            <React.Fragment key={index}>
              <Row key={index} style={{ alignItems: "center" }}>
                <Text>
                  How many
                  <DaysField
                    component={TextField}
                    name={`itineraries.${index}.days`}
                    placeholder="days"
                    normalize={val => val && parseInt(val)}
                  />
                  of itinerary?
                </Text> …

我正在使用formik我的表格。我想react-draft-wysiwyg用formik来实现编辑器。但是，我在我的案例中发现了以下警告。

Warning: Formik called `handleBlur`, but you forgot to pass an `id` or `name` attribute to your input:

因此，我认为，如果存在验证问题，我将无法显示错误，并且如果我移至下一个表单并返回到已将内容放在编辑器上的表单，则状态也不会保留。

这是导致这些问题的警告还是我错过了一些重要的事情？

这是我尝试绑定的formik方式react-draft-wysiwyg

import React from "react";
import styled from "styled-components";
import { Editor } from "react-draft-wysiwyg";
import htmlToDraft from "html-to-draftjs";
import draftToHtml from "draftjs-to-html";
import { EditorState, convertToRaw, ContentState } from "draft-js";

import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";

const EditorField = ({
  input,
  meta,
  field,
  form,
  label,
  placeholder,
  labelCss
}) => {
  const [active, setActive] = React.useState();
  const …

在深入讨论主要问题之前，我的用例是我尝试将滚动处理到所需的部分。我将在左侧设置导航，并在右侧设置与导航相关的表单部分列表。和Navigation是Form Section子组件。这是我构建代码的方式

Parent.js

const scrollToRef = ref => window.scrollTo(0, ref.current.offsetTop);

const Profile = () => {
  const socialRef = React.useRef(null);
  const smsRef = React.useRef(null);
  const handleScroll = ref => {
    console.log("scrollRef", ref);
    scrollToRef(ref);
  };
  return (
    <>
      <Wrapper>
        <Grid>
          <Row>
            <Col xs={12} md={3} sm={12}>
              <Navigation
                socialRef={socialRef}
                smsRef={smsRef}
                handleScroll={handleScroll}
              />
            </Col>
            <Col xs={12} md={9} sm={12}>
              <Form
                socialRef={socialRef}
                smsRef={smsRef}
              />
            </Col>
          </Row>
        </Grid>
      </Wrapper>
    </>
  );
};

Navigation.js(child component) 我尝试使用forwardRef，但似乎它只接受一个参数作为引用，尽管我有多个引用。

const Navigation = React.forwardRef(({ handleScroll }, ref) => …

我正在尝试使用中继样式分页。但是，我在无限滚动时遇到了麻烦。当我滚动或加载下一组数据时，我只会获取当前数据，而不会将其合并到先前的数据中。这就是我所做的

缓存文件

import { InMemoryCache } from '@apollo/client';
import { relayStylePagination } from '@apollo/client/utilities';

const cache = new InMemoryCache({
  typePolicies: {
    Query: {
      fields: {
        conversation: relayStylePagination(),
      },
    },
  },
});

export default cache;

会话查询

就我而言，像 first、after、before、last 这样的参数都在 params 对象内

export const CONVERSATION = gql`
  query conversation($channel: ShortId, $contact: ShortId, $params: ConnectionInput) {
    conversation(channel: $channel, contact: $contact, params: $params) {
      status
      data {
        pageInfo {
          ...PageInfo
        }
        edges {
          cursor
          node {
            ...Communication
          }
        }
      }
    }
  }
  ${PAGE_INFO}
  ${COMMUNICATION} …