Передавать данные с помощью alpine js @click

У меня есть ссылка на alpinejs @click event

<a class = "parent post_no" data-value = "<?php echo $total_posts_parent ?>" @click = "filterPosts(<?= $category->term_id; ?>)"><?= esc_html( $category->name); echo " ". "(" .$total_posts_parent . ")" ?></a>

как я могу добавить Var $total_posts_parent в @click и получить его в моей альпийской функции?

Функция

Хотите, чтобы значок on @click $total_posts_parent заполнился total

Alpine.data("filterPosts", (adminURL) => ({
posts: "",
limit: 6,
category: 0,
post_type_js: post_id,
showDefault: true,
showFiltered: false,
offset: 0,
total: 0, // want to get the value from the varible here

javascript php ajax onclick alpine.js

08.03.2024 16:27

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

214

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

С помощью $el.dataset.value вы можете получить доступ к значению данных текущего элемента, вы можете использовать его в событии @click или непосредственно в методе filterPosts():

@click = "total += parseInt($el.dataset.value) || 0; filterPosts(<?= $category->term_id; ?>)">

или:

@click = "filterPosts($el.dataset.value, <?= $category->term_id; ?>)">

.....

<script>

Alpine.data("filterPosts", (adminURL) => ({

   ......

   filterPosts: function (theValue, termId) {

       this.total += parseInt(theValue) || 0;
       
       .....
   }

</script>

или:

Alpine.data("filterPosts", (adminURL) => ({

   ......
    
    total: 0,

    filterPosts: function ($someData) {

        this.total += parseInt(this.$el.dataset.value) || 0;

    }

Если я использую второй пример, как мне включить это в мою функцию alpin?

— 08.03.2024 18:07

Первый за победу, спасибо

— 08.03.2024 18:13

хм, по крайней мере сейчас сработало НЭН

— 08.03.2024 18:31

Я отредактировал ответ, добавив пример для второго варианта. Более того, если вы планируете присвоить значению данных нечисловое значение, вы можете использовать parseInt(this.$el.dataset.value) || 0 для управления значениями NaN.

— 08.03.2024 19:19

08.03.2024 17:27