> 웹 프론트엔드 > JS 튜토리얼 > vue 태그 속성 데이터 바인딩 및 접합을 구현하는 방법

vue 태그 속성 데이터 바인딩 및 접합을 구현하는 방법

php中世界最好的语言
풀어 주다: 2018-05-29 09:59:25
원래의
2089명이 탐색했습니다.

이번에는 vue 태그 속성 데이터 바인딩 및 splicing을 구현하는 방법을 보여 드리겠습니다. vue 태그 속성 데이터 바인딩 및 splicing을 구현하기 위한 주의 사항 은 무엇입니까?

vue 공식 홈페이지에서 문서를 스캔한 후 웹사이트 프로젝트를 작성하기 시작했는데 디자인이 없어서 바이두에서 h5 우승 소프트웨어 웹사이트를 찾아서 복사해서 조금 망가진 줄 알고 변경했습니다. 내용을 변경하세요.

먼저 목록 표시 만들기를 시작하세요

vue 인스턴스가 준비된 후 객체에 기본 데이터를 추가하면 목록이 성공적으로 로드됩니다. 소스 코드를 확인하여 생각한 내용이 맞는지 확인하세요. 현재는 초기화된 기본 배열만 표시됩니다. 목록의 작업과 점프는 아직 추가되지 않았습니다. 초기화된 배열에 ID 필드와 번호를 추가해 보세요

새로고침해봐도 효과가 없습니다. 캐시가 특히 심각합니다. 캐시를 지우거나 강제로 새로 고쳐야 합니다. vue는 콘솔에서 a 태그 콘텐츠(Article 1)가 {{id }} 문법 오류 , 문서를 확인해 보니 비슷한 예가 없어서 내 경험을 바탕으로 다시 작성해 보기 시작했습니다
잠시 후 문서가 적합하지 않다는 것을 알았습니다. 충분히 주의 깊게 읽지 말고 타겟으로 삼아야 합니다. 태그의 클래스와 스타일이 바인딩되어 있는 것을 보았고, 객체 구문과 배열 구문이 있다는 것을 보았습니다. 더 이상 고민하지 않고 먼저 a 태그에 객체 작성 방법을 작성하고 새로 고쳐서 효과를 확인했습니다. a 태그의 href가 이런 디테일/[object object ] 같아서 웃었습니다.

아직도 잘못 사용한 것 같습니다. 배열 구문 설명을 읽어본 후 1조 이제 작동합니다

왜 배열 구문이라고 하는 걸까요? 아직도 이해가 안 되네요. 왜 이곳은 이렇게만 쓸 수 있는 걸까요? 비슷한 Safety를 찾아 다른 사람들이 어떻게 쓰는지 확인해보세요. code

<tr v-for="item in Strategys" class="ng-scope">
 <td>
  <a class="ng-binding ng-scope" v-bind:href="[&#39;xxx/detail/&#39;+item.Id]" rel="external nofollow" rel="external nofollow" >{{item.Name}}</a>
 </td>
로그인 후 복사

다음 단계는 Ajax를 사용하여 서버 데이터를 요청하는 것입니다. 항상 초기화 및 기본 데이터를 사용하는 것은 불가능합니다.

이 기사의 사례를 읽은 후 방법을 마스터했다고 믿습니다. PHP 중국어 웹사이트의 다른 관련 기사에 주목하세요!

추천 자료:

create-react-app을 수정하여 여러 페이지를 지원하는 방법

select를 사용하지 않고 vue에서 드롭다운 상자 기능을 구현하는 방법

위 내용은 vue 태그 속성 데이터 바인딩 및 접합을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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