page-refresh 相关问题

我有一个类似这样的 vue 应用程序我有一个像这样的 vue 应用程序 <template> <div class="text-center"> <table class="table"> <thead> <tr> <th scope="col">پاسخ</th> <th scope="col">سؤال</th> <th scope="col">شماره سؤال</th> </tr> </thead> <tbody> <tr v-for="question in this.questions" :key="question.id-1"> <th scope="row"><input class="form-check-input" type="checkbox" /></th> <td>{{question.question_text}}</td> <td>{{question.id-1}}</td> </tr> </tbody> </table> <button type="submit" class="btn btn-primary m-5" @click="handlsubmit">ثبت پاسخ</button> </div> </template> <script> export default { name: "InitialTest", data() { return { questions: this.$store.state.diagnosis.question }; }, beforeCreate() { this.$store.dispatch("diagnosis/insertQuestion"); } 第一次加载的时候没问题，但是当我刷新页面时，请求被调用但是组件没有加载

asynchronous request vuejs3 page-refresh lifecycle-hook

回答 0 投票 0

onbeforeunload 窗口位置更改不起作用

我想使用 JavaScript 捕获页面重新加载事件，然后重定向到不同的 URL（即在同一浏览器选项卡中加载不同的页面），而不是让现有页面重新加载....

javascript redirect reload page-refresh

回答 1 投票 0

每次刷新页面看起来都没有大小（凌乱）

我在我的网页上使用了 Vue 框架，但在刷新页面时出现了未调整大小的 div（尤其是导航栏）的错误。我的主页（index.vue）没有出现这个问题。它只发生在

html css vue.js bootstrap-4 page-refresh

回答 0 投票 0

刷新后在同一张幻灯片上保留轮播图像

我有一个简单的 html 图像轮播用作讲故事的演示。每当我点击刷新按钮时，它总是让我回到第一张图片。

local-storage carousel page-refresh

回答 0 投票 0

在反应网络应用程序中为不同用户刷新页面时保持状态

我有点新反应，我正在尝试显示特定用户与机器人的对话数据。并且对话作为字符串数组存储在存储状态中。那会……

javascript reactjs redux page-refresh redux-persist

回答 0 投票 0

清爽的图片轮播网站总是让我回到第一张图片

我正在使用 VSCode 设计一个简单的图像轮播，用作讲故事的演示。每张图片底部都有一个副标题，用于添加图片描述。本质上，它的两个车...

local-storage carousel page-refresh liveserver

回答 0 投票 0

如何更新盒子

如何更新以下框... 团队成员任务... 如何更新以下框... <div className="container team-member-tasks"> <header className="header-box"> <h1>Team Member Tasks</h1> ...按照以下脚本将任务标记为完成后... const TaskButton = task => { if (task.task.status !== 'Complete') { return ( <td> <h3 onClick={() => markAsDone(task)} style={{ color: 'red' }} data-toggle="tooltip" data-placement="top" title="MARK AS DONE. MARKING THIS AS DONE WOULD REMOVE THE TASK PERMANENTLY." className="markAsDoneButton" > X </h3> </td> ) } else { return <td></td> } } const markAsDone = async task => { task.task.status = 'Complete' const updatedTask = { taskName: task.task.taskName, priority: task.task.priority, resources: task.task.resources, isAssigned: task.task.isAssigned, status: task.task.status, hoursBest: parseFloat(task.task.hoursBest), hoursWorst: parseFloat(task.task.hoursWorst), hoursMost: parseFloat(task.task.hoursMost), estimatedHours: parseFloat(task.task.hoursEstimate), startedDatetime: task.task.startedDate, dueDatetime: task.task.dueDate, links: task.task.links, whyInfo: task.task.whyInfo, intentInfo: task.task.intentInfo, endstateInfo: task.task.endstateInfo, classification: task.task.classification, } await updateTask(String(task.task._id), updatedTask) await deleteSelectedTask(task.task._id, task.task.mother) await dispatch(getAllUserProfile()) await fetchAllTasks() } ...使用相应的状态属性，导致页面组件重新呈现新信息？如果点击删除任务按钮，任务将从数据库中删除。下面是删除按钮的截图。但是如果点击删除按钮“X”，我需要自动刷新图像中的框（或整个页面？）我试过... 1 - 我在页面组件中设置任务的初始状态（问题：哪个页面？标题框在哪里？我应该创建一个新的 jsx 还是可以使用相同的组件？（也许是其中之一错误））： const [tasks, setTasks] = useState([]); 2 - 我将任务状态作为 prop 传递给 TaskButton 组件（问题：与 taksButton 相同的脚本？我应该创建一个新的 jsx 还是我可以使用相同的 TaskButton 组件？（可能是错误之一））： <TaskButton task={task} tasks={tasks} setTasks={setTasks} /> 在 markAsDone 函数中，我更新了任务状态并调用 setTasks 函数来更新状态： const markAsDone = async task => { task.task.status = 'Complete'; const updatedTask = { ... }; await updateTask(String(task.task._id), updatedTask); await deleteSelectedTask(task.task._id, task.task.mother); await dispatch(getAllUserProfile()); await fetchAllTasks(); // Update task status const updatedTasks = tasks.map(t => { if (t._id === task.task._id) { return { ...t, status: 'Complete' }; } else { return t; } }); setTasks(updatedTasks); }; 在页面组件中，我使用更新的任务状态重新渲染组件（问题：哪个页面？同样的header-box在哪里？我应该创建一个新的jsx还是我可以使用相同的组件？（也许是其中一个错误））： <div className="container team-member-tasks"> <header className="header-box"> <h1>Team Member Tasks</h1> </header> <TaskList tasks={tasks} /> </div> 鉴于您提供的内容，您似乎正在寻找一种在任务列表状态发生变化时更新用户界面的方法(tasks) 一种方法是使用 useState() 组件中的 <TaskList tasks={tasks}/> 挂钩来更新状态并根据当前任务列表呈现列表。示例结构的快速草图可能看起来像这样（为简单起见，我省略了 TaskButton 组件和您的任务数据结构）：任务列表组件 const TaskList = ({ tasks }) => { const [tasksState, setTaskState] = useState(tasks); const onRemove = (id) => { setTaskState(() => taskState.filter(t => t.id !== id)); // other logic } const onComplete = (id) => { const newTasks = tasksState.map(t => { if(t.id === id) { t.isComplete = !t.isComplete; } return t; }); setTasks(() => newTasks); } return( <div> {tasksState.length !== 0 && tasksState.map((t, idx) => { <TaskItem taskProps={t} onComplete={onComplete} onRemove={onRemove} /> }) } </div> ); } 任务项组件 const TaskItem = (props) => { // props.taskData is the shape of your data and is simply a placeholder const onComplete = () => { props.onComplete(props.taskData.id); } const onRemove = () => { props.onRemove(props.taskData.id); } return ( <div> {props.taskProps.taskData} <button onClick={onComplete}>Complete Me</button> <button onClick={onRemove}>Delete Me</button> </div> ) } 在上面，我们在 TaskListComponent 中为您的任务列表设置了一个初始状态，这是我们构建的 tasks 道具。为了这个例子，我假设 tasks 道具是一个对象数组。然后我们设置方法来处理任务的删除和完成，这会改变当前任务列表的状态，从而重新渲染它。这些方法采用任务 ID 来查找 tasksState 数组中的给定元素。将任务映射到 TaskItems 时，我们为组件提供 onComplete 和 OnRemove 属性作为指向我们刚刚创建的方法的指针。然后在 TaskItem 组件中，我们创建方法来处理任一按钮类型的点击并调用父方法（将任务的 id 传递给父级以进行查找）。有更多简洁的方法可以做到这一点，但我在这个例子中保持简单。希望这有帮助。链接到我做的一个例子：https://jsfiddle.net/danielheery20/ep2fcjxn/ 如果有任何错误，请记下或提出更改建议。我不能问澄清问题，因为我没有这样做的评级，这就是为什么我正在做一个假设

javascript reactjs refresh page-refresh

回答 1 投票 0

更新我的 WordPress Rest API 数据未流经 React

好吧，我正在使用 wordpress Api，我正在使用 react-query 来重新运行数据。数据显示正常。但是，当我更新 wordpress Api 时，它没有捕捉到更新。如果我想...

react-query page-refresh

回答 0 投票 0

React Form Hook 的控制器渲染的 TextField 字段值在刷新后不保留

我正在尝试在编辑表单页面的刷新中保留表单值，它正在使用反应表单挂钩，并且我正在尝试通过其父级作为道具传递表单的值。默认值已设置...

javascript reactjs react-hook-form page-refresh react-forms

回答 0 投票 0

无法加载模块脚本：来自服务器的 MIME 类型错误预期的 javascript 但得到文本/html

在我的角度应用程序中，我有 app-routing-module，在我的 componenet admin-home 之一中，我有 admin-home-routing-module，我在其中添加了其他组件作为子路由。一切正常。但是当我...