newsource

Echarts3.0 쌓인 막대 차트에서 Y 축에 대한 백분율 표시 Vuejs2.0 컴포넌트의 Echarts3.0을 사용하여 누적 막대형 차트에서 y축에 백분율을 할당하려고 합니다.boundaryGap, splitnumber 등을 시도했지만 모두 효과가 없었습니다.하지만 나는 그것을 달성할 수 없습니다. 어떻게 하면 Y축에 %를 얻을 수 있는지 아는 사람 있나요? export default { data: () => ({ loading: true, bar: { xAxis: { type: 'category', data: ['Location1','Location2'] }, yAxis: { type: 'value', splitNumber: 10, boundaryGap: ['0', '100%'], min:0, ma..

VuesJ, v-for 루프에서 랜덤 키 생성 좋은 저녁입니다. 문제는 다음과 같습니다.간단한 div를 표시하는 루프가 있습니다.div의 dimensiosn을 지정하는 메서드가 있습니다(이 경우 필수).단, div의 크기를 변경하여 메서드를 두 번째로 호출해도 리렌더가 없기 때문에 동작하지 않습니다. 이 문제를 해결하기 위해 다음과 같은 변수를 사용하여 v-for의 내 키에 GUID를 생성합니다. ...blabla... 이 코드를 루프 중에 직접 생성하여 연결을 회피할 수 있습니까? ...blabla... PS : guid() 메서드의 코드: guid() { return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c => (c ^ crypto.get..

intl-tel-input과 vuejs2의 병용 https://github.com/jackocnr/intl-tel-input 를 사용하여 구현하려고 합니다.vuejs2. 1개의 jQuery에 추가할 경우document.ready,$('#phone').intlTelInput({ options...}) 모든 것이 예상대로 동작하지만 입력 필드의 값을 가져오려고 할 때boolean유효한 자산, 항상 한 발 늦게 값을 확인합니다. 체크 방법은 다음과 같습니다. validatePhoneNumber: function() { var validPhoneNo = $("#phone").intlTelInput("isValidNumber"); var phoneNo = $("#phone").intlTelInput("getNum..

VueJ: @keydown, @keyup, 그리고 이것.$refs는 입력에서는 동작하지만 md-text area에서는 동작하지 않습니다. 다음을 사용하여 기본 속도 입력 게임을 성공적으로 완료했습니다.vue.js'타이핑 박스'는...모든 것이 잘 작동했습니다.그러나 사용자가 입력할 수 있는 긴 문장과 함께 게임에 더 많은 레벨을 추가했을 때, 나는 내 게임을 바꿀 필요성을 알게 되었습니다.에 요소화하다.- avue.js요소. 문제: 에서 정상적으로 동작하고 있던 다음의 어트리뷰트.예상대로 되지 않는다: @keyup="checkAnswer()" @keydown="keymonitor" @keydown.ctrl.86="noPaste"(붙여넣기 방법)Ctrl+V) @keydown.shift.45="noPaste..

VueJ를 사용하여 테이블에 JSON 객체 표시s 서버측 조작을 처리하고 있는 Larabel 앱에서 취득한 JSON 오브젝트를 VueJ를 사용하여 표시하려고 했습니다.어떤 형태로든 도움을 주시면 감사하겠습니다. 다음은 내 larabel 앱의 원시 JSON 데이터입니다. [{ "1": 1, "2": 2, "3": 3, "4": 4, "5": 5, "6": 6, "7": 7, "8": 8, "9": 9, "10": 10, "11": 11, "12": 12 }, { "1": 70000, "2": 66524.45, "3": 62736.11, "4": 58606.81, "5": 54105.88, "6": 49199.86, "7": 43852.3, "8": 38023.47, "9": 31670.03, "10": 2..

이벤트 대상을 클릭하면 상위 요소가 아닌 요소 또는 하위 요소가 표시됩니다. 다음 HTML 요소가 있습니다. {{ '{{ notification.title }}' }} {{ '{{ notification.created_at|moment }}' }} 그리고 이 Javascript: return new Vue({ methods: { showDetails: function (notification, event) { this.notification = notification console.info(event.target) } } } 문제는 말이다event.target클릭하면 정확한 요소가 반환됩니다.즉, 이 경우,a요소 또는 그 중 하나의 자식(h4또는p). 어떻게 하면a요소(가 있는 요소)@click핸들러)를..

Vue router-link 완전 액티브클래스 3개의 메뉴 탭(즉,router-links) 3개의 다른 루트에 대응합니다. / --> home /users --> users /posts --> posts 첫 번째router-link에 가는 것/가지고 있다exact적용된 속성으로 인해 활성화클래스가 수신되지 않습니다./users또는/posts이것은 대부분의 경우에 유효합니다만, 쿼리 파라미터의 허용을 계획하고 있습니다./예를 들어 다음과 같습니다. /?ref=producthunt 이 경우,/ router-link는 아직 활성화 되어 있을 것입니다.하지만, 내가 가지고 있는 것은exact이 속성은 url과 일치하지 않습니다.refquery 파라미터.루트 및 플립클래스를 테스트하기 위해 컴포넌트에 로직을 추가..

Vue cli 3 - NYC 이스탄불 코드가 vue 파일을 포함하지 않음 vue-cli v3에서 생성된 새로운 vue(타이프스크립트 기반) 프로젝트의 이스탄불 코드 적용 범위 보고서를 작성 및 실행하려고 몇 시간 동안 노력하고 있습니다. 테스트를 실행할 때마다: (nodemon --exec nyc vue-cli-service test:unit.ts 파일만 포함되어 있습니다.nyc에는 이러한 파일이 포함되도록 특별히 설정되어 있습니다만, 패키지json "nyc": { "check-coverage": true, "per-file": true, "lines": 80, "instrument": true, "sourceMap": true, "statements": 80, "functions": 80, "branc..

두 번째 모드를 닫은 후 포커스가 잘못됨 vue.js 2와 bootsrap 3을 사용하여 두 번째 모드를 엽니다. 며칠 전 두 번째 모달에 포함된 컨트롤에 초점을 맞추는 방법에 대한 질문을 했습니다.나는 그 문제를 해결하는 훌륭한 답을 얻었다. 문제 첫 번째 모듈을 열 때 사용자가 스크롤하여 아래쪽을 볼 수 있습니다.그러나 두 번째 모달 열기 및 닫기 후 포커스는 첫 번째 모달 포함 페이지로 이동합니다.그리고 사용자가 스크롤하여 다른 첫 번째 모달들을 볼 때 첫 번째 모달 뒤로 페이지를 스크롤합니다. 특히 모달의 크기가 화면 높이보다 클 때는 매우 사용하기 불편합니다.이걸 막을 방법이 있나요? 이 문제를 재현하려면 답변을 열고 "스니펫 확장"을 클릭하십시오.저는 그게 좋습니다. $('#my-modal')..

Vue 라우터 링크: 형제 또는 자녀 관련 링크 저는 Vue 2를 프레임워크로 사용하고 함께 제공되는 Vue Router를 라우팅 목적으로 사용하는 웹 애플리케이션을 개발하고 있습니다. 탭 형식의 뷰를 개발하고 있기 때문에, 현재의 어프로치는 메인 컴포넌트의 자경로를 정의하는 것입니다.다음과 같은 것들이 있습니다. { path: '/user/:id', component: User, children: [ { path: '', component: UserHome }, { path: 'profile', component: UserProfile }, { path: 'posts', component: UserPosts } ]} 셋업은 정상이며 라우팅은 예상대로 동작합니다.여기서 링크의 정의에 대해 알아보겠습니다...