TypeError："onChange不是一个函数“
TypeError："onChange不是一个函数"是一个常见的错误类型，通常在前端开发中出现。这个错误表示在代码中尝试调用一个不是函数的变量。
造成这个错误的原因可能有以下几种：
- 变量未定义或赋值错误：在使用onChange时，可能没有正确定义或赋值一个函数给该变量。这可能是由于拼写错误、变量名错误或者变量没有被正确初始化导致的。
- 作用域问题：如果onChange函数定义在另一个作用域中，而你尝试在当前作用域中调用它，就会出现这个错误。确保你在当前作用域中可以访问到onChange函数。
- 引入错误的库或模块：如果你使用了一个错误的库或模块，其中没有定义onChange函数，就会出现这个错误。确保你引入的库或模块正确，并且包含了你需要的函数。
解决这个错误的方法取决于具体的情况，以下是一些常见的解决方法：
- 检查变量名和函数定义：确保你正确定义了onChange函数，并且将其赋值给正确的变量。检查拼写错误和变量名是否正确。
- 检查作用域：确保你在当前作用域中可以访问到onChange函数。如果onChange函数定义在另一个作用域中，尝试将其移动到当前作用域中或者通过正确的作用域链访问它。
- 检查引入的库或模块：确保你引入的库或模块正确，并且包含了你需要的函数。查阅相关文档或者示例代码，确保你正确使用了库或模块提供的函数。
在腾讯云的产品中，可能没有直接与这个错误相关的特定产品或链接。然而，腾讯云提供了一系列云计算产品和服务，可以帮助开发者构建和管理云端应用程序。你可以参考腾讯云的官方文档和开发者社区，了解更多关于云计算和相关技术的知识。
请注意，以上答案仅供参考，具体解决方法可能因具体情况而异。在解决问题时，建议仔细检查代码，并参考相关文档和资源，以获得准确和全面的解决方案。
相关·内容
是否不建议在事件中使用更新的setState语法？在调试过程中，我看到我输入的第一个字母带有一个适当的e.target.value。不过，之后我立即得到了TypeError，如下所示。
// onChange(e) {
// this.setState(prevState => {
// return { username: e.target.value} <--- TypeError: Cannot read property 'value' of null
// })
// }
//显然，下面的setState运行良好
onChan
浏览 0提问于2018-08-17得票数 1
回答已采纳
我想将onchange事件添加到formset中，我尝试在views.py中这样做，但是它给我添加了这个错误：
'name':input(attrs={
TypeError: input() takes no keyword arguments
views.py
ParteFormSet = formset_factory(ParteForm, extra=extra_forms, max_num=20, widgets={
'name':input(attrs={
'onchange':
浏览 1提问于2021-11-23得票数 0
回答已采纳
我试图在我的中创建onChange函数。以下是我的代码：
const find = (event) => {
event.preventDefault();
if (event.target.value === "Users") {
setSearchUsers(true);
setSearchTeams(false);
} else if (event.target.value === "Teams") {
setSearchUsers(false);
setSearchTeam
浏览 8提问于2021-08-15得票数 4
2回答
我是刚开始发展的，最近学会了反应。我正在创建一个事件托管应用程序并实现一个搜索栏，但是当我在搜索栏中键入某些内容时，我遇到了一个错误。
在event.jsx文件中，我有handleSearch函数。
handleSearch = query => {
this.setState({ searchQuery: query });
};
getPagedData = () => {
const {
searchQuery,
events: allEvents
} = this.state;
let filtered = a
浏览 0提问于2019-09-03得票数 0
回答已采纳
在antd with react中，如果我有下面这样的内容，那么一切都很好：
<Form>
<Form.Input>
<SomeIntermadiateComp/>
...
一些中间组件看起来如下：
const SomeIntermadiateComp = React.forwardRef(({ value, onChange }: Props, ref: any) => (
<Input
ref={ref}
value={value}
onChange={(event) => {
浏览 0提问于2021-08-05得票数 0
回答已采纳
我有一个通用输入组件，如下所示：
class GenericInputComponent extends React.Component {
constructor (props) {
super(props);
this.handleChange = this.handleChange.bind(this);
}
handleChange (evt) {
this.props.onChange(evt);
}
render () {
return (<Something />)
}
}
GenericCompone
浏览 1提问于2018-08-04得票数 1
回答已采纳
我在为复选框的onchange编写一个checked()函数时遇到了一个问题：
<input
type="checkbox"
id = "checked"
onchange="checked()"
/>
这是我的javascript：
const check = document.getElementById("checkbox")
const yes = document.getElementsByClassName("yes")
function che
浏览 4提问于2022-03-14得票数 1
回答已采纳
import React, { Component } from "react";
import PropTypes from "prop-types";
import Textarea from "react-textarea-autosize";
class InputSet extends Component {
constructor(props) {
super(props);
this.state = {};
}
static propTypes = {
onChange: PropType
浏览 3提问于2019-12-25得票数 2
回答已采纳
我是第一次使用jest来进行反应程序的单元测试，
该应用程序使用Flux模式，我已经编写了一个组件“天气”，在转到另一个组件之前，我想为该组件编写测试并采用TDD方法。
我的代码运行良好，但是测试失败了。
TypeError: tree.props.onChange is not a function
气象组件代码：
// @flow
import React from 'react';
import api from '../api';
import weatherStore from '../stores/weatherStore';
/
浏览 4提问于2016-09-20得票数 0
2回答
我如何不偏不倚地将道具添加到组件中(而不使用组件标记)？
当我尝试这个：
component.props.onChange = onChange;
我得到以下错误。
TypeError:无法指定对象'#‘的只读属性'onChange’
下面是我的一些上下文代码。
FormTemplate.js
const getComponent = ( onChange, component, ) => {
component.props.onChange = onChange; // this line throws the error
return componen
浏览 1提问于2019-07-17得票数 0
回答已采纳
我无法将服务中声明的函数绑定到控制器。我基本上尝试将服务中的onChange函数绑定到控制器$scope中的onChange函数。我得到了这个错误：
angular.js:13424 TypeError:无法设置未定义的属性“onChange”
这是我的服务
app.service('myService', function($http, $rootScope) {
this.selected = {
item: ''
}
this.getData = function(key){
return $http.get('/
浏览 4提问于2016-04-16得票数 0
回答已采纳
我试图将一个输入文件<Control.file />元素引用到另一个样式良好的元素，即使在googling搜索之后，我也没有找到答案，所以我来到这里，希望能得到一个答案。
这是我的redux控件表单和useRef钩子：的一部分
const fileInput = useRef(null);
<Form model="testimonial" onSubmit={(value) => handleSubmit(value)}>
<div id="previe
浏览 2提问于2021-06-07得票数 0
这是我的测试
describe('MultipleDaySelector', () => {
test('checked the MultipleDaySelector', () => {
const propVal = ''
const { container } = render(<MultipleDaySelector parentCallbackMultipleDaySelector={propVal} />)
const checkBoxes = container.querySele
浏览 2提问于2020-04-30得票数 0
我正在开发一个扩展，用来自另一个网站的数据自动填充表单。我有一个上下文菜单，有不同的选项，每个选项都有不同的数据，但填写相同的表单。数据是动态的，并且依赖于另一个网站。使用"chrome.tabs.executeScript“我可以插入一些数据，但不能触发字段的"onchange”事件。我可以更改select的值，但网站有一个事件"onchange“，当我更改该值时，它不会触发，并且没有通过"chrome.tabs.executeScript”运行"onchange“。它显示的错误是：“未捕获TypeError: object #的属性'onch
浏览 1提问于2013-12-05得票数 6
回答已采纳
我正在使用一个构建MERN Stack应用程序("react": "^16.14.0")，该应用程序具有一个使用DatePicker ("react-datepicker": "^4.2.1")设置日期范围的表单。目前，正在选择日期的值，但名称尚未定义。这是在选择日期时抛出TypeError并使应用程序崩溃。如何将e.target.name设置为startDate和endDate？ TyperError react-dom.development.js:327
Uncaught TypeError: Cannot read p
浏览 46提问于2021-10-04得票数 0
回答已采纳
我有问题，将我的反应代码转换为新的格式。你能帮帮我吗。现在我有了
function getStateFromFlux() {
return {
...
};
}
const TasklistsPage = React.createClass({
getInitialState() {
return {
...getStateFromFlux(),
isCreatingTaskList: false
};
},
....
_onChange() {
浏览 2提问于2017-06-20得票数 0
回答已采纳
当我在map方法中调用onChange函数时，会得到以下错误
Uncaught TypeError: Cannot read property 'onCheckChange' of undefined at onChange
我的代码如下
getPlanCheckbox(jsonParseservicelist, bbuserid) {
const returnresult = jsonParseservicelist.map(function (single) {
return (
<div classNa
浏览 15提问于2020-04-22得票数 0
回答已采纳
1回答
在onChange中响应测试功能
、、、、
我有以下无状态组件：
import React from 'react';
const Input = ({ name, onChange, type }) => (
<input
name={name}
onChange={onChange}
type={type} />
);
export default Input
像这样的util函数：
export const getValue = e => ({
name: e.target.getAttribute('name'),
val
浏览 0提问于2018-05-10得票数 0
回答已采纳
TypeError: Cannot read properties of undefined (reading 'name')
和
Uncaught TypeError: Cannot read properties of undefined (reading 'name')
我相信问题是当PhoneInput调用函数"OnChange“时，但我不知道如何修复它。
代码src: landing-page/resources/js/components/contact-form/contact-form.jsx
const inputs = [
...
浏览 14提问于2022-08-24得票数 0
我正在尝试自动化一个表单，但是我得到了一个错误。
Uncaught TypeError: Cannot read property 'value' of null
这是JS代码。
var elemFound = SingleNodeForXPath( searchTitle );
var result = elemFound.value; #### Uncaught TypeError: Cannot read property 'value' of null ###
return "GOOD:" + result;
})();
这是js代码和错
浏览 5提问于2020-07-29得票数 0
我的代码是。
你能告诉我浏览器会返回以下错误消息吗：
ERROR TypeError: this.onChange is not a function
at RichTextEditorComponent.forwardEvent (rich-text-editor.component.ts:39)
at Object.eval [as handleEvent] (RichTextEditorComponent.html:6)
我尝试将"this“对象打印到控制台，它只返回"RichTextEditorComponent”对象。
浏览 303提问于2020-02-28得票数 3
回答已采纳
1回答
我有以下单击处理程序：
<Select
name="batchCompChooser"
value={this.state.batchCompId}
options={batchCompItems}
clearable={false}
onChange={this.handleBatchCompChange()}
/>
但是，我从onChange行中得到以下错误：
BatchComponentChooser.js?0aaf:54 Uncaught TypeError: Cannot read property '
浏览 1提问于2016-07-13得票数 0
回答已采纳
<div className="questions" id="questions">
{Array(this.state.numQuestions).fill().map((number, questionIdx) => {
return (
<div>
<label>Question</label>
<input type="text"
浏览 0提问于2018-07-05得票数 0
回答已采纳
我有两个组成部分。组件A是父组件，组件B是子组件。组件A如下所示：
A.html
<nb-box [onCreditChange]="onCreditChange"></nb-box>
A.ts
onCreditChange($event) { console.log($event) }
从组件A到B的功能被转移到B。
组件B如下所示
B.html
<div class="box">
<nb-switch (onChange)="onCreditChange($event)"></
浏览 2提问于2020-09-24得票数 2
回答已采纳
我想重新加载页面时，日期是选定的。我有个道具叫新地图。
我是个反应新手。
当日期更改时，我想在onChange时触发函数(“刷新映射”)：
import React, { Component } from 'react';
import DateTimePicker from 'react-datetime-picker';
import MapLeaflet2 from './MapLeaflet2';
class Picker extends Component {
state = {
date: new Date(),
浏览 3提问于2020-04-07得票数 0
从<input type="file">接收的文件的属性是只读的。
例如，下面重写file.name的尝试要么会静默失败，要么抛出TypeError: Cannot assign to read only property 'name' of object '#<File>'。
<input onchange="onchange" type="file">
onchange = (event) => {
const file = event.target.files
浏览 1提问于2016-12-07得票数 21
回答已采纳
在初始页面加载之后，从全局名称空间调用jquery定义的函数时，我遇到了问题。根据页面下面的代码，最初加载很好，但是当我尝试调用onchange事件时，会得到以下异常：
Uncaught TypeError: undefined is not a function
我的jquery代码如下所示：
(function ($) {
$(document).ready(function() {
var user_id = $('#user_id').val();
var identifier = $('#identifier').val
浏览 3提问于2015-03-13得票数 0
回答已采纳
未定义TypeError:无法读取未定义属性的“目标”
下拉处理程序：
handlePortfolioChange = data => (event) => {
this.resetForm();
this.setState({ selectedPortfolio: event.target.value });
}
实际SelectBox
<Select value={this.state.sp}
onChange={e =>
this.setState({sp: e.target.value
}, this.handleC
浏览 1提问于2020-03-29得票数 0
在我的代码里
....
setPin = (pin) => {
console.log(this.state)
this.setState({pin})
}
return (
<div>
{console.log("this.props --",this.setPin)}
<ReactKeyboard isNumberOnly onChange={this.setpin} />
</div>
)
ReactKeyboard是子组件，它有按钮，等等，单击I回调onChange函数。
但
在控制台
浏览 1提问于2021-02-17得票数 0
下面的代码抛出一个typeerror：‘无法读取空的属性“焦点’。离开react的文档，这应该是可行的。注意：父组件实现redux方法，但我不确定这对此组件有什么影响。
import React, { Component, createRef } from 'react';
import './Card.scss';
const Card = ({isEditing, item, onBlur, onChange}) => {
let inputText = createRef();
const editing = (editMode) =&g
浏览 1提问于2018-05-09得票数 3
我正在尝试为材料UI多选编写一个单元测试用例。 主元件代码是- import {myData} from '../constant';
export const Parent = () => {
const onChangeStatus= (selectedValues: Array<string>) => {
setTest({
...test,
values: selectedValues
});
}
浏览 12提问于2020-12-31得票数 0
我有一个输入字段，我想给它赋一个新值并触发一个.onchange()事件。我做了以下工作：
document.getElementById("range").value='500';
document.getElementById("range").onchange();
其中range是我的输入Id。我得到以下错误：
Uncaught TypeError: Cannot read property 'target' of undefined
有没有办法定义“目标”？谢谢
浏览 0提问于2010-10-22得票数 7
回答已采纳
4回答
下面是我正在编写的一个React类： import React from 'react';
export default class ExpenseForm extends React.Component {
state = {
title: ''
};
onTitleChange = (e) => {
const title = e.target.value;
this.setState(() => ({title}));
};
render() {
浏览 41提问于2020-02-19得票数 1
回答已采纳
我要得到这个TypeError
TypeError: Cannot read properties of undefined (reading 'files')
却找不到解决办法。我的应用程序正在使用react，我在处理setState钩子时得到了这个错误。
const handleCapImage = (event) => {
setPostImage(event.target.files[0]);
};
在我称之为React元素的地方
<input
type="file"
id="file"
浏览 19提问于2022-10-29得票数 -1
我已经包含了一个切换开关jquery库，当在选中时触发相同的函数时，它会告诉我"Uncaught：$(...).switchbutton is not a function“。请参阅代码。我不确定为什么它会这样做。
我还尝试了一个不同的库，称为bootstrap-toggle，但在even完成后在不同的项目上触发相同的事件时出现了相同的问题。
$('.easyui-switchbutton').switchbutton({
onChange: function(checked){
console.log(checked);//works
浏览 0提问于2019-05-15得票数 1
我有一个带有"onChange“事件的输入字段，它用"forEach”方法获取数组的元素，并且工作得很好。但是我也想在输入字段中添加一个额外的特性--避免输入空格。我应该如何附加这个附加功能？
我试图使用"onKeyDown“事件来避免空白，但可能会给我带来一个错误。下面是输入字段的代码：
mainList.js
<input
type="text"
className="form-control"
value={sprNotDeleted.value}
onKeyDown=
{this.AttributeValidation(s
浏览 0提问于2019-07-23得票数 0
回答已采纳
当我使用这个代码时：
onChange = e => {
const { name, value } = e.target;
this.setState(currentState => ({
tempInput: { ...currentState.tempInput, [name]: value }
}));
};
一切都很好，但当我这么做时：
onChange = e => {
this.setState(currentState => ({
tempInput: { ...currentState.t
浏览 0提问于2018-11-05得票数 2
回答已采纳
1回答
更改GWT客户端上的文件输入元素
、、、、
我在GWT中制作了一个客户端应用程序，它使用WebGL对图像应用后处理效果。我在文件类型的文档中添加了一个InputElement，如下所示。
InputElement inputElement = InputElement.as(Document.get().createFileInputElement());
inputElement.setAccept("image/*");
Document.get().getBody().appendChild(inputElement);
然后，我想向它添加一个onchange侦听器，因为GWT中不支持这个监听器，所以我编写了这个J
浏览 2提问于2015-10-24得票数 0
回答已采纳
嘿，伙计们，我是react-router@6的新手，我有点困惑。
当我使用useEffect钩子发布一个新的评论时，我希望用户返回到上一页，在提交评论之后，它有所有的评论。
我得到了一个错误：Uncaught TypeError: navigate.goBack is not a function。
下面是我的代码：
import { useNavigate } from 'react-router-dom';
function AddreviewForm({ onAddReview }) {
const navigate = useNavigate();
co
浏览 7提问于2022-07-13得票数 2
回答已采纳
如果我的输入中不包括value = {this.state.term}，那么一切都很好。
值不接受this.state.term
class SearchBar extends React.Component {
State = {term : ''};
render() {
return (
<div>
<form>
<div className="ui icon input">
<input ty
浏览 0提问于2019-08-30得票数 0
2回答
代码：
class Locations extends React.Component {
render() {
let { home, work, onChange } = this.props;
return <div className="controls">
<GoogleMapLoader
containerElement={
<div
{...this.pro
浏览 0提问于2016-02-25得票数 1
回答已采纳
我试着用reactjs来计算剩下的字符。我已经定义了与状态对话并传递给子组件的函数。在子组件中，我得到了一个未定义TypeError的错误:无法读取未定义的属性'length‘。
app.js
export default class App extends Component {
constructor(props){
super(props);
this.state = {max_char:32};
this.handleChange = this.handleChange.bind(this);
}
handleChange(charLeng
浏览 2提问于2016-09-25得票数 2
回答已采纳
我只是在做一些基本的事情。我有一个输入字段和一个按钮包装在表单标签中。使用useState钩子设置输入用户名。
浏览器给了我错误：- TypeError: setUser is not a function和错误在21号线上。
18 | type="text"
19 | placeholder="nick name"
20 | value={user}
> 21 | onChange={ e => { setUser(e.target.value) } }
| ^ 22 | />
23 | <
浏览 3提问于2021-03-27得票数 0
回答已采纳
3回答
因此，我有这样的反应代码，它应该可以工作：
App.jsx：
class App extends Component {
constructor(props){
super(props);
this.state = {count: props.initialCount};
this.onChange = this.onChange.bind(this);
this.state = {
questions:[
{
浏览 3提问于2016-04-27得票数 2
回答已采纳
1回答
我正在编写一个包含表单的react组件，其中包含单选按钮。我尝试创建onChange()和handleSubmit()函数，这些函数将收集所选按钮的值，并将其值记录在控制台上，但是事件对象没有被识别，我得到了以下错误：
未定义TypeError:无法读取未定义属性的“目标”
为什么会发生这种情况，我现在能做些什么？
这是我的代码：
class NoteInput extends React.Component {
constructor(props) {
super(props);
this.state={
select
浏览 1提问于2017-12-09得票数 0
4回答
我有这个标记
<form name="sortbyformtop">
<select onchange="location.href=sortbyformtop.sortbyselecttop.options[selectedIndex].value" id="sortbyselecttop">
<option value="/Search"></option>
<option value="/Search?sortby=accommoda
浏览 0提问于2012-09-20得票数 1
回答已采纳
2回答
我的onChange函数哪里出错了？我希望能够键入我的文本框，但在重新编译时，我一直会收到以下控制台错误：
**Uncaught TypeError: Cannot read property 'value' of undefined**
见下面的代码：
var name = "";
export default React.createClass({
handleChange: function() {
this.props.onUserInput(
this.refs.name.value
)
},
r
浏览 0提问于2017-01-25得票数 0
我正在使用filepicker，并设置如下：
<%= p.filepicker_field :bathroom_images, cache: true, multiple: true, onchange: "$.onFileUpload(event);" %>
这会将onChange事件设置为我输入的任何函数()。
这里有两个问题:我需要如何设置coffeescript才能被调用？
ready = ->
console.log("ready")
onFileUpload = (event) ->
console.log
浏览 0提问于2015-12-10得票数 0
回答已采纳
我的子类是ChangeProps，父类是ParentClass
class ChangeProps extends React.Component{
render(){
return(
<div>
<h2>{this.props.childname}</h2>
<button onClick={()=>this.props.onNameChange()}>Change</button>
</div>
);
}
}
class Pare
浏览 2提问于2020-06-22得票数 0
我正在尝试从我的待办事项列表中删除一个项目。到目前为止，这是我的代码。我认为我在父代码上做了一些错误的事情。我需要帮助。错误显示“未处理的拒绝(TypeError)：无法读取未定义的属性'props‘” import React from "react";
const List = props => (
<ul>
{props.items.map((item, index) => (
<li key={index}>
<input
onClick={this.pro
浏览 15提问于2019-03-21得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
