小编Gur*_*bot的帖子

我有以下简单的短路语句,应该显示组件或什么都没有:

{profileTypesLoading && <GeneralLoader />}

如果该语句为false,则呈现0而不是任何内容.

我已经做了一个console.log(profileTypesLoading)公正的事情来快速查看该profileTypesLoading属性的状态,并且它是预期的1或0.0应为false ...导致无法渲染.对？

知道为什么会这样吗？

我想从登台服务器上的子目录中提供我的Vue.js应用程序.例如:http://url.com/subdir/app/

现在,如果我这样做并设置构建配置assetsPublicPath从该文件夹提供服务,所有资产都可以正常提供,但我的应用程序无法正确路由."主页"页面被路由到"全部捕获",并且任何其他路由仅显示正常的白页404.

这是我的路由器:

export default new Router({
    mode: 'history',
    routes: [
    {
        path: '/',
        component: ContentView,
        children: [
            {
                path: '/',
                name: 'DataTable',
                component: DataTable,
                meta: { requiresAuth: true }
            },

            // ===================================
            //  Login
            // ===================================
            {
                path: '/login',
                name: 'AppLogin',
                component: AppLogin,
                meta: { checkAlreadyLoggedIn: true }
            },
            {
                path: '/logout',
                name: 'AppLogout',
                component: AppLogout,
                meta: { requiresAuth: true }
            }
        ]
    },
    {
        path: '*',
        component: ContentView,
        children: [
            {
                path: '/',
                name: 'NotFound', …

signIn()我有一个自定义登录页面，该页面在提交表单时依次调用该函数。
我只使用“凭据”提供程序。

在服务器端，我只是想抛出一个错误，以便我可以在前端处理它。似乎是一件很容易的事情。

我继续收到一条错误消息：
Error: HTTP GET is not supported for /api/auth/login?callbackUrl=http://localhost:4000/login

我重定向到的网址是：
http://localhost:4000/api/auth/login?callbackUrl=http://localhost:4000/login

这是我的代码： pages/login.js（仅相关代码。其余只是布局。）

<form
    method="post"
    onSubmit={() =>
        signIn("credentials", {
            email: "test",
            password: "test",
        })
    }
>
    <label>
        Username
        <input type="email" />
    </label>
    <label>
        Password
        <input name="password" type="password" />
    </label>
    <button type="submit">Sign In</button>
</form>

页面/api/auth/[...nextauth.js]

import NextAuth from "next-auth";
import Providers from "next-auth/providers";

const options = {
    site: process.env.NEXTAUTH_URL,
    providers: [
        Providers.Credentials({
            id: "chatter",
            name: "Credentials",
            type: "credentials",
            credentials: {
                email: { label: "Email", …

我正在为使用 Redux Toolkit 的 Next.js 应用程序运行笑话测试套件。我使用 msw 来模拟对由 Redux Toolkit 处理的 Next 应用程序之外的另一个 api 的任何必要调用。

我没有模拟所有 RTK 查询端点，仅模拟我当前在测试中使用的那些。

当我在没有通过 生成覆盖范围的情况下运行时，测试运行良好npm run test。

但是，当我通过 运行覆盖率报告时npm run test -- --coverage，所有测试都会失败，并且都有相同的错误：

- Test suite failed to run

    No element indexed by 9
    
     at ArraySet_at [as at] (node_modules/source-map-support/node_modules/source-map/lib/array-set.js:109:9)
      at BasicSourceMapConsumer.SourceMapConsumer_originalPositionFor [as originalPositionFor] (node_modules/source-map-support/node_modules/source-map/lib/source-map-consumer.js:673:30)
      at mapSourcePosition (node_modules/source-map-support/source-map-support.js:214:42)
      at wrapCallSite (node_modules/source-map-support/source-map-support.js:358:20)
      at node_modules/source-map-support/source-map-support.js:399:26
          at Array.map (<anonymous>)
      at Function.prepareStackTrace (node_modules/source-map-support/source-map-support.js:398:30)

我发现如果将 msw 处理程序设置为空数组，则不会出现错误。正如预期的那样，少数需要 API 的测试失败了。然而，除此之外，测试都运行良好。

我不确定从这里该去哪里。任何意见是极大的赞赏。

我有一个 React 项目，它显示了一堆社交媒体链接，这些链接只是各自网站的图标。我使用 icomoon 字体等来提供 icon-* 类来显示社交媒体图标。

可以理解的是，我得到的错误是：

Anchors must have content and the content must be accessible by a screen reader

在这种情况下，除了图标和文本之外我不需要任何东西，我该怎么办？我不知道如何正确地做到这一点，这样每个人都高兴。

编辑

我认为代码没有必要，因为它与任何事情都不相关。

这是吐出链接的映射。如您所见，没有文字。只是链接到的任何社交媒体网站的字体图标：

{this.props.siteInfo.social.map(function(item, i){
    return <a key={i} className={`nav_item icon-${item.social_media_type}-square`} href={item.url} target="_blank" rel="noopener noreferrer"></a>
})}

结果是：

<a key="0" class="nav_item icon-facebook-square" href="facebook.com/someprofile" target="_blank" rel="noopener noreferrer"></a>

我想npm install在一个文件夹中运行以安装一些节点模块等。

您如何在 PHP 脚本中执行此操作？我已经尝试了很多东西，很明显我不清楚实际问题;)

我尝试了以下方法：

shell_exec("npm install"); （失败）

exec("npm install") （因 127 错误而失败，这意味着我认为它找不到要运行的脚本）

有任何想法吗？

我正在使用TCPDF生成PDF.我有一个生成内联pdf的测试脚本,以及一个将PDF保存到服务器然后通过电子邮件发送出来的脚本.

保存到文件的PDF在某些图像上的图像质量极差.你可以在下面看到:

内联显示的PDF(在浏览器中)具有完美的图像质量:

有谁知道为什么两者之间会有区别？相同的代码,根据文档保存的方式不同:

$pdf->Output(self::$base_url.$filename, 'I');

VS

$pdf->Output(self::$base_url.$filename, 'F');

我有以下用于购物车的“购买”按钮。

我还有一个名为“工具提示”的组件，它将自动显示错误/成功消息。它使用按钮的宽度来确定其中心点。因此，我使用 `ref 因为我需要访问它在 DOM 中的物理大小。我读到过使用 ref 属性是个坏消息，但我不确定如何才能定位基于物理 DOM 的子组件。但这是另一个问题......；）

我将应用程序的状态保留在 localStorage 中。如下所示： https: //egghead.io/lessons/javascript-redux-persisting-the-state-to-the-local-storage

我遇到的问题是我必须success在渲染之前清除状态的属性。否则，如果我在状态中有成功消息，则在初始 render() 时也会Tooltip尝试渲染。这是不可能的，因为它所依赖的按钮还不在 DOM 中。

我认为通过 Redux 操作清除成功状态componentWillMount会清除成功状态，从而解决问题，但 render() 方法似乎无法识别状态已更改，并且仍会显示旧值在console.log()中。

我的解决方法是检查按钮是否存在以及成功消息：showSuccessTooltip && this.addBtn

为什么 render() 无法识别 componentWillMount() 状态变化？

这是 ProductBuyBtn.js 类：

import React, { Component } from 'react';
import { connect } from 'react-redux'

// Components
import Tooltip from './../utils/Tooltip'

// CSS
import './../../css/button.css'

// State
import { addToCart, clearSuccess } from './../../store/actions/cart'

class ProductBuyBtn extends Component { …

我有一个父组件ProductTest，它持有状态作为真​​相的来源。状态是一组变体项目。在此示例中，每个项目都经过了简化，并有一个标题。

当Variant的标题更新时，子代将通过父代传递的prop调用其处理程序回调。然后，父级将更新状态，而子级将具有新的title属性。

我所看到的是，孩子的componentWillReceiveProps功能将显示相同的值this.props和nextProps。我认为，由于值是由父级提供的，因此两者将有所不同。

我不确定自己做错了什么。

这是父产品测试组件：

import React, { Component } from 'react'
import { connect } from 'react-redux'
import axios from 'axios'
import Variant from './variants/Variant'

import { REACT_APP_API_URL, REACT_APP_SITE_KEY } from '../../../shared/vars'

import '../../../css/variants.css'

class ProductTest extends Component {
    constructor(props) {
        super(props)
        this.state = {
            variants: []
        }

        this.handleVariantTitleChange = this.handleVariantTitleChange.bind(this)
        this.handleVariantValueChange = this.handleVariantValueChange.bind(this)
    }

    componentDidMount() {
        this.loadData()
    }

    loadData() {
        const apiEndpoint = 'products/some-product'
        const AUTH_HEADER = { Authorization: REACT_APP_SITE_KEY …

我正在尝试在SSR应用程序中使用redux-persist 5.10.0实现redux 4.0.0，并且遇到一个问题，在该问题中，createStore()如果应用程序崩溃，我将无法正确提供预加载状态。

发生的情况是应用程序从服务器加载了初始状态，但是当应用程序尝试createStore()在客户端上预加载状态时，应用程序刷新并崩溃。我以为是因为我的preloadedState格式不正确？

但是我不确定，因为在控制台，UI，nada中没有收到任何错误消息。

这是一些相关的代码：

商店/index.js

export default function configureStore(preloadedState = {}) {
    // This will store our enhancers for the store
    const enhancers = [];

    // Add thunk middleware
    const middleware = [thunk];

    // Apply middlware and enhancers
    const composedEnhancers = compose(
        applyMiddleware(...middleware),
        ...enhancers
    );

    // Set up persisted and combined reducers
    const persistedReducer = persistReducer(persistConfig, rootReducer);

    // Create the store with the persisted reducers and middleware/enhancers
    const store = createStore(persistedReducer, preloadedState, composedEnhancers);

    const …