React, Vue 및 Svelte: 라디오 바인딩 비교
10137 단어 reactvuesveltejavascript
라디오 바인딩 입력...
쉬워요 ! 모든 프레임워크에서 라디오 바인딩은 정말 쉽습니다. Vue와 Svelte는 그들의 마법을 계속합니다 :)
확인해보세요 🚀
반응하다
Live Example
const [picked, setPicked] = useState<string>('React');
const handleChange = ({
target: { value },
}: React.ChangeEvent<HTMLInputElement>) => {
setPicked(value);
};
<section>
<h2>Radio</h2>
<input
type="radio"
id="react"
value="React"
name="picked"
defaultChecked={true}
onChange={handleChange}
/>
<label htmlFor="react">React</label>
<br />
<input
type="radio"
id="vue"
value="Vue"
name="picked"
onChange={handleChange}
/>
<label htmlFor="vue">Vue</label>
<br />
<span>Picked: {picked}</span>
</section>
뷰
Live Example
const picked = ref('react');
<section>
<h2>Radio</h2>
<input
type="radio"
id="react"
value="react"
v-model="picked"
checked="true"
/>
<label for="react">React</label>
<br />
<input
type="radio"
id="vue"
value="vue"
v-model="picked"
/>
<label for="vue">Vue</label>
<br />
<span>Picked: {{ picked }}</span>
</section>
날씬한
Live Example
let frameworks: string = 'React';
<section>
<h2>Radio</h2>
<input
type="radio"
bind:group={frameworks}
id="react"
value={'React'}
/>
<label for="react">React</label>
<br />
<input
type="radio"
bind:group={frameworks}
id="vue"
value={'Vue'}
/>
<label for="vue">Vue</label>
<br/>
<span>Picked: {frameworks}</span>
</section>
Reference
이 문제에 관하여(React, Vue 및 Svelte: 라디오 바인딩 비교), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/ccreusat/react-vue-and-svelte-comparing-radio-binding-57eo텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)