废话不多少,直接上案例。下面给让我为大家演示一下ChatGPT生成的React框架的前端代码:
import React, { useState } from 'react';
import axios from 'axios';
const ChatApp = () => {
const [inputText, setInputText] = useState('');
const [outputText, setOutputText] = useState('');
const handleInputChange = (e) => {
setInputText(e.target.value);
};
const handleSubmit = async (e) => {
e.preventDefault();
try {
const response = await axios.post('/api/goodsInfo', { id: 123456});
setOutputText(response.data.output);
} catch (error) {
console.error(error);
}
};
return (
<div>
<h1>ChatGPT小程序制作工具示例</h1>
<form onSubmit={handleSubmit}>
<input type="text" value={inputText} onChange={handleInputChange} />
<button type="submit">发送</button>
</form>
<div>
<p>{outputText}</p>
</div>
</div>
);
};
export default ChatApp;
通过扫码小程序二维码即可加入使用学习,正版的原创的chatGPT,无需科学上网,手机+PC都可以,加速您摸鱼的神器来了