我最近才开始研究javascript和React.js。目前，我的main.html文件中有几个脚本标记，我需要能够访问React.js组件中这些标记中的一些变量。有这样的事吗？
浏览 2提问于2016-07-01得票数 5
1回答
我有一些困难，在使用风格的组件在一个反应应用程序(创建-反应-应用程序)，我也使用材料-用户界面。
我是一个关于样式组件的noobie，所以我尝试在一个基于另一个资料ui组件的样式组件内设计一个素材ui组件。为了澄清我想要做的事情，下面是代码：
const StyledContainer = styled(Container)`
background-color: ${props=>props.theme.defaultBackground};
${FormControl} {
width:100%;
}
`;
容器和For
浏览 8提问于2020-04-14得票数 0
回答已采纳
以非常简单的react.js应用程序为例
<main></main>
<section>
<input value="abc" />
</section>
。。
data = note: ""
setNote = -> data.note = $('input').val()
display = React.createFactory React.createClass render: ->
React.DOM.div null, "The
浏览 1提问于2015-02-02得票数 1
回答已采纳
我试图在我的React中使用Cloudinary上传Widget，但是我有一个问题。在运行项目时，Upload Widget会立即出现，但当关闭并再次打开时，应用程序会崩溃并显示以下消息：
widget.open()不是函数
备注：上传工作正常
import React, { Component } from 'react';
import './App.css';
class App extends Component {
showWidget = (widget) => {
widget.open();
}
chec
浏览 1提问于2019-03-22得票数 3
回答已采纳
3回答
我设法将组件呈现在模板上的div上，如下所示：
Index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Example</title>
</head>
<body>
{% load render_bundle from webpack_loader %}<h1>Example</h1>
<div id="react-app">&l
浏览 2提问于2017-05-08得票数 3
class Template extends React.Component {
constructor(props) {
super(props)
this.state = {
isMenuVisible: false,
isVideoModelVisible: false,
loading: 'is-loading'
}
this.handleToggleVideoModel = this.handleToggleVideoModel.bind(this)
}
handleToggleV
浏览 0提问于2018-09-06得票数 0
我正在使用this，并尝试使用"close“方法。当我遇到如下所示取消警报时，如何调用close方法？我相信这是我对react钩子/类如何与公共方法一起工作的普遍误解。任何帮助都将不胜感激！ <Swipeable
renderRightActions={renderRightActions}
onSwipeableRightOpen={() => {
Alert.alert(
"Delete " + title + "?",
浏览 29提问于2020-06-26得票数 0
2回答
我在调试这段代码时有问题。
我有一个应用程序组件：
function App() {
const [state, setState] = useState(0);
const onSelectItem = () => {
console.log(": onSelectItem -> currentState", state);
};
// items is an array of ReactNode: button, when click on it. It will log the currentState.
const items
浏览 1提问于2020-03-27得票数 0
我正在写我的React表单，我有以下代码： import { useState } from "react";
const SignupComponent = () => {
const [values, setValues] = useState({
name: "",
email: "",
password: "",
error: "",
loading: false,
message: "",
showForm: true,
浏览 63提问于2021-05-10得票数 1
我对反应相当陌生，目前正在进行一个使用exif-js库读取图像EXIF数据的项目，请参阅下面的示例代码。EXIF.getData(file, callback)是从这个库中读取给定图像并在回调中执行其他一些任务的方法。在我的组件中，我定义了一个函数(doSomething)，用于回调。但是，当我试图调用函数this.doSomething()时，它会抛出错误：this.doSomething is not a function。
在他们的中，他们解释了In the callback function you should use "this" to access the ima
浏览 3提问于2021-06-13得票数 1
回答已采纳
我是ReactJ的新手。在我的应用程序中，我插入了下面的代码来验证textArea，但是当我键入它时，它会抛出以下错误。
NewBrand.js:67 Uncaught TypeError: Cannot read property 'validateName' of undefined
at handleNameChange (NewBrand.js:67)
at TextArea._this.handleTextareaChange (TextArea.js:94)
at HTMLUnknownElement.callCall
浏览 0提问于2018-10-20得票数 0
回答已采纳
1回答
我正在尝试使用redux设置我的react项目，并且我遵循了一个使用counter的基本示例，我可以递增和递减。计数器最初在页面上正确显示为0 -但是，当我点击按钮时，increment操作似乎没有被调度，因此，计数器不会更新。
我的LoginPage.js
/* eslint-disable no-unused-expressions */
import { connect } from "react-redux";
import React, { Component } from "react";
import { selectCounter } from
浏览 0提问于2020-04-06得票数 0
我刚把我的项目从39号更新到42个。该项目使用ReactiveNavigation4。在更新之前，一切正常，现在我得到了一个恼人的错误：
警告: React.createElement: type无效--需要一个字符串(用于内置组件)或一个类/函数(用于复合组件)，但got: undefined。您可能忘记从定义在其中的文件中导出组件，或者您可能混淆了默认导入和命名导入。
检查您在App.js:89的代码。
in (由ExpoRoot创建)
在ExpoRoot (at renderApplication.js:45)
在RCTView (at View.js:34)
在视图中(在AppCont
浏览 0提问于2021-08-20得票数 0
我试图使用react的useRef将自定义组件连接到ref，以便使用html2canvas并将元素呈现到画布上。
const dataLetters = {
headers: [
'A',
'B',
'C',
'D',
'E',
'F',
'G'
],
rows: [
['A', 'B', 'C', 'D', 'E', '
浏览 5提问于2021-12-13得票数 2
回答已采纳
我想将我的react组件打包为一个umd库。
下面是webpack我的背景：
module.exports = {
devtool: 'eval',
entry: [
'./lib/index'
],
output: {
path: path.join(__dirname, 'dist'),
filename: 'lib.js',
library: 'lib',
libraryTarget: 'umd'
},
resolve: {
浏览 3提问于2015-12-13得票数 11
回答已采纳
当我像这样使用webpack设置时，ReactDOM将完全排除在bundle.js之外
externals: {
"react": "React",
"react-dom": "ReactDOM"
},
但一开始，我是这样写的
externals: {
"react": "React",
"reactDom": "ReactDOM"
},
reactDom包含在bundle.js中，并增加
浏览 0提问于2016-05-17得票数 1
回答已采纳
1回答
反应动态标签名
、、
假设以下以及所有组件/fus/fci/ssg只有一个带有站点支持的h1。我想了解为什么它是一个有效的反应元素，但这些元素并没有显示相同的呈现。也就是说，其中一个有h1元素，另一个没有，其想法是不要为不同的站点创建带有切换的大型组件，每个站点都将根据导航选择被替换掉。我没有看到任何关于这件事的文件除非我错过了..。
{this.state.renderSite}
<Fci site="Fci"/>
import React from 'react';
浏览 2提问于2016-04-12得票数 2
回答已采纳
我在react本机中实现了Stack，但是它显示了一个错误："TypeError:无法读取未定义的正确的‘导航’“。令人惊讶的是，这对于一个组件是有效的，但是当我在另一个组件中使用相同的代码时，它会显示上面的错误。
import React from "react";
import "react-native-gesture-handler";
import { NavigationContainer } from "@react-navigation/native";
import { createStackNavigator } fr
浏览 2提问于2020-09-10得票数 0
回答已采纳
2回答
看过这个之后：
我正在尝试创建一个Facebook登录的Reactjs组件。
我正在使用ES6，并且不断收到："Cannot read property 'parentNode‘of undefined“
代码：
'use strict';
import React from 'react';
import addons from 'react/addons'
export default class Login extends React.Component {
constructor(props) {
浏览 2提问于2015-07-02得票数 2
我想测试我的应用程序，它有一个用户输入--一个向Google发送请求的查询--然后显示响应。
我已经将数据获取逻辑分离到它自己的自定义钩子中。我想模仿模拟服务工作人员的抓取。当我运行测试时，我收到一个无效的钩子呼叫。
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:
1. You might have mismatching versions of React
浏览 11提问于2021-07-09得票数 1
我使用React.js，我想通过使用React.js的ruby来进行服务器端呈现。
我使用它，但出现了一个问题。
没有呈现子组件。
例如
单组分
//javascript
class Hoge extends React.Component{
render(){
return(
<div>component</div>
)
}
}
//html
<%= react_component('Hoge', {}, {prerender: true}) %>
没问题的。它被渲染了。
组件包括子组件。(相同的文件)
浏览 3提问于2016-11-18得票数 1
我目前正在尝试在react原生应用程序中使用上下文。我的上下文代码如下： import React, { useState, createContext } from 'react'
export const AuthContext = createContext()
export const AuthProvider = ({ children }) => {
const [currentUser, setCurrentUser] = useState(null)
return (
<AuthContext.Provider value={{
浏览 14提问于2020-11-23得票数 0
回答已采纳
嗨，我试图将forwardRef添加到子组件中，但是在添加forwardRef时得到了以下信息：TypeError: Component is not a function
该组成部分的定义如下：
import React from 'react';
import { forwardRef } from 'react';
import { TextInputFocusEventData } from 'react-native';
import { NativeSyntheticEvent, StyleSheet } from 'reac
浏览 3提问于2021-09-02得票数 13
回答已采纳
在Angular 2+中，我们有@component指令，我们可以在其中传递元素选择器、css文件、html模板文件、..我们通过下面的代码片段来实现。 import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.css']
})
export class HomeCom
浏览 19提问于2019-01-24得票数 0
你好，谢谢你阅读这个问题！
我已经学习了几个星期，我很难理解refs如何获得React的实例并将其放入JS变量中。
例如，我们可以讨论文档的示例：
class CustomTextInput extends React.Component {
constructor(props) {
super(props);
this.focusTextInput = this.focusTextInput.bind(this);
}
focusTextInput() {
// Explicitly focus the text input using the raw
浏览 1提问于2018-02-18得票数 1
回答已采纳
在使用时，与功能组件相比，您有一个优势，即在父级更新时组件并不总是呈现出来。实际上，它只在组件道具发生更改时呈现，在本例中，只有当您更改输入时才会呈现。
如何将一个对象传递给PureComponent而不破坏使用这种组件的所有优点？
这是否意味着，一旦您有了预期对象类型的道具，最好只是使组件具有功能？
我增加了一个例子来说明我的意思..。(可能你需要在一个新窗口打开它，因为有很多不同的孩子)
class TestPureComponent extends React.PureComponent {
render() {
return <div style={{border
浏览 0提问于2019-08-29得票数 3
回答已采纳
2回答
我试图更好地理解React，所以我制作了这个玩具示例，试图让React组件从另一个组件调用函数。我正在查看Chrome上的React Dev工具，但控制台上没有记录任何内容。我不知道为什么会这样。谁能给我解释一下为什么这是错误的，以及如何修复它？ TestButton.js文件 import React from 'react';
import Button from '@material-ui/core/Button';
export default function TestButton() {
return(
<div>
浏览 25提问于2021-07-27得票数 0
回答已采纳
1回答
该模型在hashRouter in App.js下呈现。当其状态isOpen为真时，将显示该模态。
当我试图用redux显示一个Modal时，我就得到了这个错误。
Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?
Check the render method of `TrapFocus`.
in ConnectFunction (at Modal.js:41)
in
浏览 1提问于2019-07-18得票数 6
回答已采纳
1回答
嗨，我现在和react-router-dom一起工作。我似乎没有正确地遵守指示，因为我遇到了以下问题：
bundle.js:1085 Warning: Failed prop type: The prop `history` is marked as required in `Router`, but its value is `undefined`.
in Router
bundle.js:2279 Uncaught Error: A <Router> may have only one child element
at invariant (bundle.js:2
浏览 1提问于2017-06-15得票数 0
React有类似于this.props.children的东西：
Vue.js是否也有一些类似的访问子元素？
浏览 2提问于2016-08-16得票数 11
回答已采纳
我创建了一个概念反应组件的小证明，并将其推到-> 中。
我希望能够通过以下操作将这个组件导入到一个不同的React项目中：npm install git+https://github.com/lropero/poc.git，然后是import Poc from 'poc'，并且能够呈现组件(即<Poc />)。问题是，，我得到的反应不变的违反错误#321，因为我使用钩子(在本例中的useEffect)。我试着注释这个钩子，我能够看到<p>TEST</p>元素呈现得很好。我猜这是Webpack的问题在建设波克的包袱？
相关文件如下(中的所
浏览 3提问于2020-09-18得票数 1
回答已采纳
1回答
关于这一点有很多文章和例子，但由于某些原因，似乎没有什么有效的方法。 我有一个react组件，它有一个子组件。而且，为了简单起见，我想模拟测试中的子组件。 该组件如下所示： ...
import { ProjectTeam } from '../../assignment/project-team/component';
export const ProjectOverview: React.FC<ProjectOverviewProps> = ({ projectId }) => {
...
return (
<>
浏览 13提问于2021-08-23得票数 0
回答已采纳
1回答
我想在使用redux成功登录后导航到profile页面，但是它会产生错误，如下所示：
未处理的承诺拒绝: TypeError:未定义不是对象(计算'_this3.props.navigation')
import React from 'react';
import { StyleSheet, Text, View, Button, TextInput, Image, TouchableHighlight } from 'react-native';
import { connect } from 'react-redux&#
浏览 0提问于2019-03-19得票数 0
我正在学习react教程，但是我被卡住了。我正在尝试更改控制台中某个元素的状态。但是当我输入这个的时候
reactComponent.setState({
isVisible:false
})
我从chrome得到这个错误。
Uncaught ReferenceError: reactComponent is not defined
at <anonymous>:2:1
at Object.InjectedScript._evaluateOn (<anonymous>:895:140)
at Object.InjectedScript._e
浏览 1提问于2015-08-21得票数 1
我制作了这个示例应用程序来学习如何在一起使用react路由器-dom和redux，除了，我不知道如何在组件中访问道具？
所有代码都在这里，
入口文件index.js
import { render } from 'react-dom'
import React from 'react'
import { Provider } from 'react-redux'
import { ConnectedRouter } from 'react-router-redux'
import App from './app'
浏览 4提问于2017-08-31得票数 1
回答已采纳
嗨，我是新来的React & nodeJS，我试图通过react调用nodejs，即使在呈现页面之后，我的componentDidMount也不会被触发。有人能告诉我我到底在哪里失踪吗？
var React = require('react');
module.exports = React.createClass({
getInitialState: function() {
return {
jobs: []
}
},
componentDidMount: function() {
浏览 4提问于2017-03-04得票数 2
回答已采纳
我有两个js文件。1.Talker.js 2.Button.js
Talker.js
import React from 'react';
import ReactDOM from 'react-dom';
import { Button } from './Button';
class Talker extends React.Component {
talk() {
let speech = '';
for (let i = 0; i < 10000; i++) {
speech
浏览 0提问于2018-04-29得票数 4
回答已采纳
1回答
我有以下自定义输入组件：
export type InputProps = {
error?: string
} & InputHTMLAttributes<HTMLInputElement>
export const Input: FunctionComponent<InputProps> = ({ error, ...props }) => (
<input {...props} />
)
用法
<form onSubmit={handleSubmit(onSubmit)}>
<Input placehold
浏览 9提问于2022-11-25得票数 2
回答已采纳
1回答
例如，如果我有从api接收数据以填充下拉选择的FunctionalComponent下拉列表，并使用下面的钩子更新所选值的状态
const [value, setValue] = React.useState();
然后如何访问/读取下拉组件之外的值(在本例中是数字数组)？
为了获得更好的上下文，我将首先介绍使用下拉组件的位置：
import React from 'react';
import Dropdown from '../Components/Dropdown.js'
import GraphTypeDropdown from '../Comp
浏览 2提问于2021-01-11得票数 2
，我收到了这个错误：，我真的需要一些帮助
不变量错误:不变冲突:元素类型无效:预期字符串(用于内置组件)或类/函数(用于组合组件)，但got: object。
这是Index.js下面的代码
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(<App />, document.getElementById('root'));
App.js
import Reac
浏览 1提问于2021-02-04得票数 0
回答已采纳
1回答
试图嵌套反应元件
、、、、
我是React.js的新手，正在尝试用它来建立自己的网站。我要做的是在父组件中嵌套一个子组件；父组件应该在主页面中呈现，其子组件嵌套在主页面中。下面我列举了一个我的尝试的例子。
到目前为止，我的方法是
在“childComponent.js”中创建子组件
将子组件导出为“childComponent”
将“childComponent”导入父组件
在父组件中呈现“childComponent”
将父组件导出为“parentComponent”
将“parentComponent”导入“index.js”
在“parentComponent”中呈现“index.js”
浏览 1提问于2017-01-15得票数 2
1回答
我正在修改react-router，绑定以实现简单的路由。我在他们的示例(但没有imports)中输入我的代码。
我在浏览器中得到了这个错误：
不变量错误:不变冲突:元素类型无效:预期字符串(用于内置组件)或类/函数(用于组合组件)，但got: object。
我就是这么做的。
我将脚本附加到页面、ReactRouter.min.js和react-routes.js中的代码中。还有react、react-dom和jquery (这三者都是app.js中的)：
<script src="/js/app.js" type="text/javascript
浏览 3提问于2015-12-21得票数 5
回答已采纳
在我的App.js (或主组件)中，我呈现我的Navbar组件
import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
import Navbar from './components/layout/navbar/Navbar';
import './App.css';
const App = () => {
return (
<Router>
<Navbar /
浏览 3提问于2021-09-08得票数 0
回答已采纳
我对Reactjs很陌生。我希望做的是在Main.js和SignupForm.js之间创建一个通用函数，下面是代码。
以下是我的index.html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesh
浏览 1提问于2016-06-06得票数 2
回答已采纳
2回答
handleShowMatchFacts = id => {
// console.log('match', id)
return fetch(`http://api.football-api.com/2.0/matches/${id}?Authorization=565ec012251f932ea4000001fa542ae9d994470e73fdb314a8a56d76`)
.then(res => {
// console.log('match facts', matchFacts)
th
浏览 4提问于2017-05-02得票数 0
回答已采纳
4回答
responsive.js
import { useMediaQuery } from "react-responsive";
export default {
sm: useMediaQuery({ maxWidth: 768 }),
md: useMediaQuery({ minWidth: 769, maxWidth: 1024 }),
lg: useMediaQuery({ minWidth: 1025 }),
};
当我试图在App.js中导入它时
import {sm,md,lg} from "../../responsive"
错误发
浏览 2提问于2021-11-25得票数 1
回答已采纳
2回答
反应:可加载不起作用？
、、、
嗨，我在react中是新手，我想用Loadable实现Loadable，但是当或时，它不工作它显示的空白页。
你能纠正我哪里做错了吗？我也得到了-
警告:错误的道具类型:无效的道具component string 类型的string提供给 Route**，预期** function**.**
我的代码是：
home.js
import React, { Component } from 'react';
import { Link} from 'react-router-dom';
class Home extends Component {
ren
浏览 1提问于2018-06-18得票数 3
回答已采纳
1回答
我正在学习react，并试图在rails应用程序中使用react on rails gem创建一个Google places自动完成组件。这是我目前所拥有的，需要一些帮助来完成它。
我想我在正确加载Google javascript库时遇到了问题。查看下面来自控制台的错误消息(请注意，我的应用程序中运行了正确的密钥)。
Navigated to https://react-on-rails-basic-tutorial-mcl282.c9users.io/
js?key=[KEY]&libraries=places&callback=initAutocomplete:102 U
浏览 14提问于2017-02-21得票数 3
回答已采纳
2回答
我的Store.js：
import { observable, useStrict, action } from 'mobx';
useStrict(true);
export const state = observable({
contacts: []
});
export const actions = {
addContact: action((firstName, lastName) => {
state.contacts.push({
id: Math.floor((Math.random(
浏览 0提问于2017-08-23得票数 5
回答已采纳
当前行为
使用react-native-tab-view v1.0.0时，出现错误：
Invariant Violation: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, o
浏览 36提问于2018-08-31得票数 4
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
