Могу ли я передать реквизиты от дочернего компонента к родительскому в Astro?

Скажите, пожалуйста, можно ли передать реквизит из дочернего Astro компонента в родительский? Что-то вроде обратного вызова в React:

<Component callBack = {arg=>{
  //do something with arg
}} />

Есть ли аналоги в Astro? Спасибо за внимание!

Вы хотите передать какое-то состояние? или метод?

miraj 01.01.2023 20:19

Я просто хочу передать некоторые значения, например, ввод или флажок для родителя.

Kiten 01.01.2023 20:53
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
2
318
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

вы не можете передавать реквизиты из компонента child в компонент parent. если вы хотите открыть некоторые методы компонента child для parent, вы можете использовать useImperativeHandle хук.

function Form() {
  const ref = useRef(null);

  function handleClick() {
    ref.current.focus();    // focus is method from `child
  }

  return (
    <form>
      <MyInput label = "Enter your name:" ref = {ref} />
      <button type = "button" onClick = {handleClick}>
        Edit
      </button>
    </form>
  );
}

const MyInput = forwardRef(function MyInput(props, ref) {
  const inputRef = useRef(null);

  useImperativeHandle(ref, () => {
    return {
      focus() {
        inputRef.current.focus();
      },
      scrollIntoView() {
        inputRef.current.scrollIntoView();
      },
    };
  }, []);

  return <input {...props} ref = {inputRef} />;
});

Ссылка

Это реакция, а не астро

Konrad 01.01.2023 20:50
Ответ принят как подходящий

Реквизиты могут течь только вниз в Astro, самое близкое, что вы можете сделать, что-то вроде того, что вы описываете, это передача аргументов слотовым функциям

Пример из документов:

// src/components/Shout.astro
---
const message = Astro.props.message.toUpperCase();
---
{ Astro.slots.has('default') &&
  <Fragment set:html = {Astro.slots.render('default', [message])} />
}
// src/pages/index.astro
---
import Shout from "../components/Shout.astro";
---
<Shout message = "slots!">
  {(message) => <div>{message}</div>}
</Shout>

превращается в

<div>SLOTS!</div>

Другие вопросы по теме