0

Существует объект в котором одно из свойств - 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)}/>

Tastr
  • 21
  • что такое handleLogout? – Grundy Jan 13 '23 at 13:45
  • Собственно ты сам вызываешь эту функцию handleLogout() – Grundy Jan 13 '23 at 13:53
  • Это функция, которая должна выполняться при on:click на целевую кнопку, а выполняется при нажатии на любую.

    Как я написала, её содержание не имеет значения, поэтому я не стала её тут приводить.

    Она импортируется из отдельного файла. Пробовала убрать из неё всё лишнее и оставить в таком формате: 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:01
  • Повторюсь: в коде JSON.stringify(handleLogout()) - идет явный вызов функции. Он происходит не по кнопке. – Grundy Jan 13 '23 at 14:11
  • 1
    Если ты хочешь сохранить именно функцию - присваивай именно ее action: handleLogout. Не надо ее сразу вызывать – Grundy Jan 13 '23 at 14:13
  • Спасибо. Так действительно работает. – Tastr Jan 16 '23 at 05:47

0 Answers0