> 웹 프론트엔드 > View.js > Vue가 설정을 사용하는 이유

Vue가 설정을 사용하는 이유

WBOY
풀어 주다: 2022-02-15 15:17:11
원래의
4754명이 탐색했습니다.

Vue에서 설정은 재사용을 캡슐화하는 데 사용됩니다. 설정은 결합된 API를 사용하도록 설계되었습니다. 구성 요소가 커지면 논리적 문제 목록도 늘어나 구성 요소를 읽고 이해하기 어려워질 수 있습니다. 함수로 추출되므로 이 부분의 논리에 대해 걱정할 필요가 없습니다.

Vue가 설정을 사용하는 이유

이 기사의 운영 환경: Windows 10 시스템, Vue 버전 2.9.6, DELL G3 컴퓨터.

vue가 setup을 사용하는 이유

  • vue3에서 setup의 용도는 무엇입니까?

setup은 결합된 api

  • 이전 구성 요소의 옵션을 사용하지 않는 이유

data, Computed , 방법, 조직 논리가 대부분의 경우 작동하는지 확인하세요. 그러나 구성 요소가 커질수록 논리적 문제 목록도 늘어납니다. 이로 인해 구성 요소를 읽고 이해하기 어려울 수 있으며, 특히 처음에 해당 구성 요소를 작성하지 않은 사용자의 경우 더욱 그렇습니다. setup을 통해 이 부분을 함수로 추출할 수 있으므로 다른 개발자는 로직의 이 부분을 신경 쓸 필요가 없습니다.

  • Vue 라이프사이클에서 setup의 위치는

setup 바로 앞에 위치합니다. Created 및 beforeCreated는 Created 및 BeforeCreated에 사용되지만 설정 기능에서는 액세스할 수 없습니다. 또한 설정에서 다음 후크를 통해 전체 수명주기를 작동할 수 있습니다. props와 context를 허용할 수 있으며, 그 중 props는 반응형 데이터이므로 직접 분해하고 할당할 수 없습니다. Context는 반응형 데이터가 아니며 직접 분해하고 할당할 수 있습니다. 설정이 반환되면 이 속성을 반환해야 합니다. vue2.x

props:['test']
setup(props,context){
//const {test} = props //错
const {test} = toRefs(props) //对
const { attrs, slots, emit }= context //对
  return {
    test
  }
}
로그인 후 복사
    Priority와 같이 사용됩니다. 데이터가 props와 setup 모두 동일한 이름의 속성을 갖고 있으면 setup에서 반환된 속성이 가장 높은 우선순위를 갖습니다. 다음 코드를 예로 들면 다음과 같습니다. son's setup
  • 재사용성을 캡슐화하려면

  • 프로젝트나 애플리케이션은 구현에 대해서만 이야기할 수는 없지만 지속적인 통합과 다중 사용자 협업도 고려해야 합니다. 과거에는 프런트엔드의 비즈니스 복잡성이 너무 낮았습니다. , 그래서 컴포넌트화를 사용했거나, 지난 전역 상태 관리에 어려움을 겪었습니다. 문제를 해결할 수 있으며 기껏해야 약간의 노력이 필요하지만 지금은 End 인터페이스 호출이 너무 낭비적이므로 좋지 않습니다. 프런트 엔드가 완전한 캡슐화 재사용성 지원(즉, 완전한 프로그래밍 기능)을 갖추고 클러스터에서 뷰 서비스의 위치를 ​​유지할 수 있도록 더 나은 아키텍처를 갖는 것이 매우 필요합니다

【관련 권장 사항: "

vue.js 튜토리얼

"]

위 내용은 Vue가 설정을 사용하는 이유의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
vue
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿