Существует объект в котором одно из свойств - action содержит функцию, которая должна выполняться при щелчке на кнопку.
Проблема в том, что эта функция срабатывает не только при щелчке на эту кнопку, но и вообще на любые кнопки даже в других компонентах.
Содержимое функции handleLogout значения не имеет. Она всегда выполняется даже если написать там просто console.log("hello world")
Почему так происходит? Как сделать так, чтобы она срабатывала только при щелчке на нужную кнопку?
<script lang="ts">
import { Button } from "sveltestrap";
import { handleLogOut } from "./HandleLogout";
let btnTest = {
role: null,
icon: "box-arrow-left",
name: "Выход",
url: "/",
action: JSON.stringify(handleLogout())
}
const handleLogOutBtnTest = (btn) => {
if (btn.action) {
btn.action()
}
navigate(btn.url, { replace: true });
adminPagetoggle()
};
</script>
<Button on:click={() => handleLogOutBtnTest(btnTest)}/>
handleLogout? – Grundy Jan 13 '23 at 13:45handleLogout()– Grundy Jan 13 '23 at 13:53Как я написала, её содержание не имеет значения, поэтому я не стала её тут приводить.
Она импортируется из отдельного файла. Пробовала убрать из неё всё лишнее и оставить в таком формате: export const handleLogout = () => { console.log("hello world")
– Tastr Jan 13 '23 at 13:53}
action: JSON.stringify(handleLogout())- в чем смысл этой строки? тут ты явно вызываешь эту функцию – Grundy Jan 13 '23 at 13:54По задумке - кнопок в меню много. При клике на каждую должна выполняться своя функция, которая указана в action объекта, относящегося к этой кнопке. Объекты будут в массиве и мапиться с помощью {#each} Тут для вопроса решила всё упростить и оставить только один объект и одну кнопку.
– Tastr Jan 13 '23 at 14:01JSON.stringify(handleLogout())- идет явный вызов функции. Он происходит не по кнопке. – Grundy Jan 13 '23 at 14:11action: handleLogout. Не надо ее сразу вызывать – Grundy Jan 13 '23 at 14:13