'userInput'は定義されますが、未使用のvars 'userOutput'は定義されていませんが、未使用-VALSを使用しないでください。 -- javascript フィールド と reactjs フィールド 関連 問題

'UserInput' is defined but never used no-unused-vars 'UserOutput' is defined but never used no-unused-vars












0
vote

問題

日本語

新しいビーは、一連の講義に従って反応する 私はちょうどこの簡単なコードを排除しようとしていますが、何か問題が発生し、 'userinput'のようなエラーが定義されましたが、パスとSRCは完全に大丈夫です* app.js

<事前> <コード> import React, { Component } from 'react'; import './App.css'; import UserInput from './UserInput/UserInput'; import UserOutput from './UserOutput/UserOutput'; class App extends Component() { render() { return ( <div className="App"> <p>some random text</p> <userInput /> <userOutput /> </div> ); } } export default App;

userinput.js

<事前> <コード> import React from 'react'; const userInput = () => { return <input type="text" />; }; export default userInput;

userOutput.js

<事前> <コード> import React from 'react'; const userOutput = () => { return(<div> <button>hello </button> </div>) }; export default userOutput;
英語

newbie to react, following a series of lecture i just trying to excute this simple code but something went wrong and gave me error like 'UserInput' is defined but never used* although path and src sets perfectly ok *

App.js

import React, { Component } from 'react'; import './App.css'; import  UserInput from './UserInput/UserInput'; import UserOutput from './UserOutput/UserOutput';  class App extends Component() {    render() {   return (     <div className="App">       <p>some random text</p>       <userInput />       <userOutput />      </div>    ); } } export default App; 

UserInput.js

 import React from 'react'; const userInput = () => {  return <input type="text" />; }; export default userInput;  

UserOutput.js

 import React from 'react';  const userOutput = () => {  return(<div>     <button>hello </button>      </div>)   }; export default userOutput;  
</div
     
   
   

回答リスト

0
 
vote
vote
ベストアンサー
 

改善

DEFINE class App extends Component{} ではありません<コード> class App extends Component(){}

インポートされた UserInput UserInput

のような <事前> <コード> <UserInput /> <UserOutput />

app.js

<事前> <コード> import UserInput from './UserInput/UserInput'; import UserOutput from './UserOutput/UserOutput'; class App extends Component{ render() { return ( <div className="App"> <p>some random text</p> <UserInput /> <UserOutput /> </div> ); }} export default App;

あなたのコードのライブデモデモ

 

Improvement

Define class App extends Component{} not class App extends Component(){}

Define imported UserInput,UserInput like

      <UserInput />       <UserOutput />  

App.js

import  UserInput from './UserInput/UserInput'; import UserOutput from './UserOutput/UserOutput';  class App extends Component{    render() {   return (     <div className="App">       <p>some random text</p>       <UserInput />       <UserOutput />      </div>   ); }} export default App; 

Live demo for your code demo

</div
 
 
   
   

関連する質問

2  Next.jsとTypeScriptでReact StyleGuidistを設定する  ( Setting up react styleguidist with next js and typescript ) 
私はnext.jsとtypescriptでReact Styleguidistをセットアップしようとしていますが、問題に歩き続けます。 My現在のstyleguide.config.jsは次のようになります: <事前> <コード> const path = r...

84  React Statelessコンポーネントのイベントハンドラ  ( Event handlers in react stateless components ) 
React Statelessコンポーネントでイベントハンドラを作成するための最適な方法を見つけようとしています。私はこのようなことができる: <事前> <コード> const myComponent = (props) => { const myH...

0  Charts RecativeJSを使用してレンダリングのAPIからデータオブジェクトを表示するためのFor Loopを作成します。  ( Make a for loop to show data object from api in render using charts reactjs ) 
チャートのAPIからデータを表示する必要があります( HTTPS) ://canvasjs.com/react-charts/chart-index-data-label/ ) これは私のAPIの前部: <事前> <コード> //API Gains stat...

1  Vanilla JavaScriptを使用してReact App DOMに追加する方法  ( How to append to a react app dom using vanilla javascript ) 
私は私が任意のウェブサイトからテキストを強調することを可能にするクロム拡張を作成しています。 あなたにアイデアを与えるために <事前> <コード> var newDom = document.body.innerHTML; var selection = wi...

0  共有可能なパネルのURLを反応させる  ( React sharable panel url ) 
次のスニペットを検討してください。今すぐボタンをクリックするde 'IE indexroot 私が達成したいのは: "href="http://localhost:3000/de/?open" http:// localhost:3000 / de /? ...

0  Mock Dispatch関数は呼び出されません  ( Mock dispatch function is not called ) 
非同期アクション作成者のテストを書いていますが、「推定モック機能が「と呼ばれている」と述べた問題に遭遇しました: <事前> <コード> [{"type": "GET_LOGIN_SUCCESS", "value": true}] しかしそれは呼ばれなかっ...

0  Reactでフォームを送信する方法  ( How to submit a form in react ) 
反応成分のフェッチで反応成分にはない形式を送ることができるかどうかを知りたいのです。 <事前> <コード> <form action="json.bc" class="form_search" method="post"> <input type="hid...

1  ReactJS-BootstrapフォームとH1タグを並べて配置する方法  ( How can i put a reactjs bootstrap form and h1 tag side by side ) 
私は私のフォームグループと私のh1タグを横々と横々としたいです。私はディスプレイを使ってみました:インラインブロックと他のさまざまなもののものですが運がなかった。これが私の.cssコードです: <事前> <コード> .testingForm { max-w...

0  クラスベースのAXIOS要求をフックベースのコードに統合する  ( Integrating class based axios request to the hook based code ) 
このクラスベースのAXIOSリクエストをJSONファイルからデータを取得する他のフックベースのコードに統合する方法基本的に私はデータソースの場所をAXIOS GETリクエストと置き換えたいです。ありがとう。 <事前> <コード> componentDidMou...

0  反応 - 両親にアクセスする子供たちは早すぎる?  ( React children accessing parents state too early ) 
子からapp.jsにコールバックを使用する場合、app.jsのコールバック関数は要素の状態を設定します。 同じ子関数で、次の行で、関数はこの状態にアクセスします。これはPROPとして渡されます。 この次の行がすでに更新された状態で実行されていることを確認する方...




© 2022 cndgn.com All Rights Reserved. Q&Aハウス 全著作権所有