小编me-*_*-me的帖子

Jsfiddle 未封闭的正则表达式

在此处输入图片说明任何人都知道为什么 jsfiddle 在测试 jsx 时给我这个错误。

未封闭的正则表达式

https://jsfiddle.net/chapster11/LzdfLy53/

const combobox = () => (
    <div id="box">
    working
  </div>
);

ReactDOM.render(<combobox />, document.querySelector("#app"));
Run Code Online (Sandbox Code Playgroud)

——

jsx jsfiddle reactjs

5
推荐指数
0
解决办法
964
查看次数

盖茨比一页一页

我正在使用 gatsby js 并试图弄清楚如何使用 Gatsby 链接在同一页面的 div 内呈现新组件的页面级侧边栏我可以使用 react-router-dom 来做到这一点,但在 Gatsby 中我可以做到find 是如何创建博客文章这让我发疯,因为我找到的每个教程都是相同的博客文章。

在此处输入图片说明

这是我的布局页面 /layouts/index.js

export default ({ children }) => (
  <div id="layout">
    <header>
      <h3>Header</h3>
      <MainNav />
    </header>
    {children()}
  </div>
)
Run Code Online (Sandbox Code Playgroud)

关于页面 /pages/about.js

export default ({ location, match }) => {
  console.log('location = ', location, 'match = ', match );
  return (
    <div id="about">
      <SideBar />
      <div id="content">
        // . add child template or component for link clicked in sidebar
      </div>
    </div>
  );
};
Run Code Online (Sandbox Code Playgroud)

我想要做的是,当用户单击侧边栏中的链接时,会停留在 about 上,但会根据在 about 侧边栏中单击的 …

reactjs gatsby

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

如何使用成帧器运动对每个状态变化进行动画处理

我认为渲染成帧器运动会重新执行我的动画,因为初始设置为隐藏,动画设置为显示。但这种情况并非如此。

我怎样才能让它在每次状态变化时重新播放动画?

import React, { useEffect, useState } from "react";
import { motion} from "framer-motion";
import styled from "styled-components";

const Screen = () => {
  const [state, setState] = useState(1);

  useEffect(() => {
    setInterval(() => {
      setState(Math.random());
    }, 4000);
  }, []);

  return (
    <Title variants={variants} animate="show" initial="hide">
      {console.log("re-render")}
      {`screen ${state}`}
    </Title>
  );
};

const Title = styled(motion.div)`
  color: red;
`;

export const variants = {
  show: {
    opacity: 1,
    y: 0,
    transition: {
      ease: "easeOut",
      duration: 0.3
    }
  },
  hide: …
Run Code Online (Sandbox Code Playgroud)

reactjs framer-motion

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

Firebase 模拟器 UI 需要项目 ID 才能启动

我已经浏览了文档,但无法让 UI firebase 模拟器工作。

\n

我在 mac M1 上使用 firebase 版本:9.22.0

\n

控制台中出现警告。

\n
i  emulators: Starting emulators: hosting\ni  hosting: Serving hosting files from: build\n\xe2\x9c\x94  hosting: Local server: http://localhost:5001\n\xe2\x9a\xa0  emulators: The Emulator UI requires a project ID to start. Configure your default project with 'firebase use' or pass the --project flag.\n\n\xe2\x94\x8c\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x90\n\xe2\x94\x82 \xe2\x9c\x94  All emulators ready! It is now safe to connect your app. \xe2\x94\x82\n\xe2\x94\x94\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x98\n\n\xe2\x94\x8c\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\xac\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x90\n\xe2\x94\x82 Emulator \xe2\x94\x82 Host:Port      \xe2\x94\x82\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\xbc\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\xa4\n\xe2\x94\x82 Hosting  \xe2\x94\x82 localhost:5001 \xe2\x94\x82\n\xe2\x94\x94\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\xb4\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x80\xe2\x94\x98\n  Emulator Hub running at localhost:4400\n  Other reserved ports: …
Run Code Online (Sandbox Code Playgroud)

firebase firebase-tools

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

Next.js 中间件模块未找到:无法解析“fs”

_middleware当我尝试初始化 Firebase admin V9 时,在 Next.js 文件中出现此错误。有人知道如何解决这个问题吗?

./node_modules/@google-cloud/storage/build/src/bucket.js:22:0
Module not found: Can't resolve 'fs'
Run Code Online (Sandbox Code Playgroud)

../../firebase/auth-admin

import * as admin from "firebase-admin";

if (!admin.apps.length) {
  admin.initializeApp({
    credential: admin.credential.cert({
      projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
      clientEmail: process.env.FIREBASE_CLIENT_EMAIL,
      privateKey: process.env.FIREBASE_ADMIN_PRIVATE_KEY,
    }),
  });
}

const firestore = admin.firestore();

const auth = admin.auth();

export { firestore, auth };
Run Code Online (Sandbox Code Playgroud)

在我的中调用它_middleware

import { NextFetchEvent, NextRequest, NextResponse } from "next/server";
import { auth } from "../../firebase/auth-admin";

export default async function authenticate(
  req: NextRequest,
  ev: NextFetchEvent
) {
  const token = …
Run Code Online (Sandbox Code Playgroud)

javascript firebase-admin next.js

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

无法以存储库管理员身份删除 GitHub 中的分支

即使我拥有存储库的管理员权限,我也无法通过 GitHub UI 删除分支。删除按钮被禁用:

在此输入图像描述

我缺少什么?

github

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

Bootstrap datepicker更新方法导致问题

我正在尝试使用来自eternicodebootstrap datepicker,它是原始eyecon picker的一个分支.

我添加了一个jsfiddle示例,说明我正在尝试做什么.

在小提琴的所有js的底部是我初始化我的datepicker的地方.我添加了一个,setTimout所以我可以模拟动态更改datepickers日期.我已经阅读了datepicker('update');你执行操作后需要调用的地方,setDate以便更新选择器UI.

当我这样做时,它会导致一些问题.如果单击输入字段以显示日历,则日历将显示突出显示的日期,即今天的日期,而不是我更新日期的新日期.

当您关闭选择器时,它会将今天的日期追加到输入值的末尾.这不是正常行为.我要做的就是设置一个新的日期并让它同时更新UI选择器.

HTML

<div class="input-append date" id="date-picker">
    <input class="span6" size="16" type="text">
    <span class="add-on"><i class=""></i></span>
</div>
Run Code Online (Sandbox Code Playgroud)
var picker = $('#date-picker').datepicker({format:'M d, yyyy' });

var d = new Date();
d.setDate(d.getDate() + 1);

setTimeout(function(){
  picker.datepicker("setDate", d).datepicker('update');
},3000);
Run Code Online (Sandbox Code Playgroud)

jquery twitter-bootstrap bootstrap-datepicker

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

React.createRef 打字稿中的当前类型

我正在尝试查找 React.createRef 的输入内容。标头是一个自定义组件。 header.current总是说

(属性)React.RefObject.current:未知对象的类型为“未知”。

我可以将其设置为打字<any>,但这是最简单的方法。如何让 Typescript 发挥良好作用并停止抱怨。

Example: React.createRef<any>()
Run Code Online (Sandbox Code Playgroud)

完整代码:

   const header = React.createRef();
    const { container } = render(
      <Header{...props} headerRef={header} />,
    );
    const el = header.current.getButtonElement("button");
Run Code Online (Sandbox Code Playgroud)

我什至尝试将其设置为 HTMLDivElement 这就是它返回的内容。

const header = React.createRef<HTMLDivElement>();
Run Code Online (Sandbox Code Playgroud)

但下面仍然给我一个错误: (property) React.RefObject.current: HTMLDivElement | null 对象可能为“null”。

const el = header.current.getButtonElement("button");
Run Code Online (Sandbox Code Playgroud)

javascript typescript reactjs

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

未在 React 中设置 useState

当用户单击向上或向下箭头并且由于某种原因状态未更新时,我试图让 useState 工作。

即使我 setTimeout 来查看索引是否更新仍然没有。在这里完全混淆了。

import React, { useEffect, useState } from 'react';

const Wrapper = ({ children }) => {
  const [index, setIndex] = useState(-1);

  useEffect(() => {
    document.addEventListener('keydown', handler);
    return () => {
      document.removeEventListener('keydown', handler);
    };
  }, []);

  const handler = (event) => {
    if (event.key === 'ArrowDown') {
      setIndex(index + 1);
      console.log('index = ', index);
    }
  };

  return (
    <div>
      {children}
    </div>
  );
};

export default Wrapper;
Run Code Online (Sandbox Code Playgroud)

reactjs react-hooks

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

cypress cy.tick 在 cypress 组件测试中不起作用

有没有人成功地让 cy.tick() 在 cypress 组件测试中工作。cy.clock() 会停止时间,但在 cypress 组件测试中,tick 不会将其向前移动。如果有人能够做到这一点,请举出简单的例子。

再说一次,这是在 cypress 组件测试中,而不是 e2n 测试中。
我还在 before() 方法中添加了时钟。

cypress cypress-component-test-runner

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