반응형

vuejs2 417

동적 사용자 지정 구성 요소에 대한 V 유효성 검사

동적 사용자 지정 구성 요소에 대한 V 유효성 검사 나는 Vee-validate (https://baianat.github.io/vee-validate/)을 나의 모든 양식을 검증하기 위해 사용하고 있다.이제 다음 작업을 수행하고자 한다. 내 형태에서 "값" 필드는 동적인 구성요소로서, 다음에 따라 달라진다.type현재의 목적의유형은 다음과 같을 수 있다.integer,string,decimal등 그래서 유형이 바뀌면 입력도 바뀐다. 이렇게 한 거야 그리고 import string from '@/components/fields/String' import integer from '@/components/fields/Integer' import decimal from '@/components/fields/D..

programing 2022.04.11

5.1 레일의 Vue JS 2 '이 파일 형식을 처리하려면 적절한 로더가 필요할 수 있다.'

5.1 레일의 Vue JS 2 '이 파일 형식을 처리하려면 적절한 로더가 필요할 수 있다.' 기존 레일즈 앱에 VueJS를 추가하고 싶다. 그래서 나는 이 보석들을 내 Gemfile에 추가했다. gem 'webpacker' gem 'foreman' 그리고 나는 달렸다.bundle,rails webpacker:install,rails webpacker:install:vue,yarn install. 그것은 a를 창조했다.javascript폴더:app.vue일렬 종대로packs와 함께 폴더로 저장하다.hello_vue.js일렬 종대로application.js파일 앱/앱/앱부에를 하다 {{ message }} 앱/스파이프/팩/응용 프로그램js /* eslint no-console:0 */ // This file..

programing 2022.04.11

Algolia - 총 카운트가 포함된 모든 고유 태그 가져오기

Algolia - 총 카운트가 포함된 모든 고유 태그 가져오기 어떻게 하면 모든 것을 얻을 수 있을까?tags제공된 이미지에서 동그라미처럼 구별되는 특성 및 그룹화각 레코드에는 태그가 있을 수 있으며 태그는 중복될 수 있다.나는 아래와 같이 자바스크립트 API를 사용하여 이 데이터를 얻으려고 노력했지만 효과가 없었다.나는 그것이 모든 독특한 태그들을 동그라미처럼 보여주기를 기대하지만, 대신에 그것은 모든 기록을 되돌려준다.원하는 결과를 얻을 수 있는 방법에 대한 아이디어 있으십니까? import algoliasearch from "algoliasearch"; const algoliaClient = algoliasearch( process.env.VUE_APP_ALGOLIA_APP_ID, process.e..

programing 2022.04.11

Vue 양식 구성 요소에 기본 데이터 전달

Vue 양식 구성 요소에 기본 데이터 전달 여기에 간단한 Vue 2.0 폼 구성 요소가 있다.숫자 입력과 버튼(예: 입력 값이 구성 요소의 값과 연결됨을 참고하십시오.data사용.v-model.buttonText소품으로 전해진다. 초기에는 10이 아닌 값으로 렌더링할 수 있도록 기본값을 폼에 전달하는 가장 좋은 방법이 무엇인가? 사용.props그때가 되어서 하는 방법이 아닌 것 같다.v-model더 이상 제대로 작동하지 않는다. 하지만data내가 Vue 문서로 알 수 있는 한, 소품들이 할 수 있는 방식으로 전달될 수 없다. . {{ buttonText }} 소품(말씀)으로 합격할 수 있다.initialAmount) 및 초기화할 때amount데이터 함수의 값: export default { props: ..

programing 2022.04.10

@symfony/webpack-encore에서 vue-i18n-loader를 로드하는 방법

@symfony/webpack-encore에서 vue-i18n-loader를 로드하는 방법 나는 웹팩과 vue-18n이 잘 작동하는 symfony 4 어플리케이션에 Vue를 사용하고 있다.그러나 각 파일 구성 요소에 변환을 적용하고 싶다. 내 문제는 de 로딩은 내가 로딩하려고 했던 vue-i18n 로더를 로딩하는 것이다...누가 이런 짓을 한 거야?감사합니다. 내 웹 팩 파일: var Encore = require('@symfony/webpack-encore'); Encore .enableVueLoader(function(options) { //i tried to load here }) // ... .addLoader({ test: /\.styl$/, loader: 'style-loader!css-lo..

programing 2022.04.10

1초 후 VueJS에서 요소 자동 전환

1초 후 VueJS에서 요소 자동 전환 좋아, 그래서 나는 Vue(기본적으로, JS에서는 처음이지만, 나는 지금 Vue와 함께 놀고 있다 )는 것이고, 내가 하고 싶은 것은 구성요소의 템플릿 태그 안에 (클릭이 아닌) 요소를 자동으로 숨기는 것이다.jQuery에서는 다음과 같이 보일 것이다. $(function() { setTimeout(function() { $(".hideElement").hide() }, 1000); }); 하지만 이게 Vue에서는 어떻게 작동하는거지? 내 컴포넌트는 이렇게 생겼어. HELLO 버튼을 클릭할 때 요소를 전환할 수 있지만 사용자가 이 구성 요소를 입력할 때마다 클릭 이벤트 없이 1초 후에 자동으로 숨기기(새 "페이지")데이터 개체에 속성을 추가하고 v-show 지시어를..

programing 2022.04.10

웹 팩 빌드 후 구성 값 변경

웹 팩 빌드 후 구성 값 변경 정적 폴더에 config.js가 있음 module.exports = { config: { urls: { auth: localhost } } } 나는 달린다npm run build그리고 출력(저장된 폴더)을 클라이언트에 전송하여 프로덕션 환경에 배포하십시오.나는 고객이 auth의 가치를 편집할 수 있기를 바란다. 구성이 현재 웹 팩에서 외부 파일로 구성됨: const config = require(path.join(paths.STATIC, 'config.js')) externals: [{ appsetting: JSON.stringify(config) }] config.js를 웹 팩 빌드 후 변경 사항을 인식하도록 하려면 어떻게 해야 하는가?이런 건 어때?axios: funct..

programing 2022.04.10

공장 기능을 반환하는 es6 모듈(moment.js)을 조롱하는 행위

공장 기능을 반환하는 es6 모듈(moment.js)을 조롱하는 행위 나는 Jest가 처음이라 곰이야. 나는 DateFilter라는 Jest를 사용하여 Vue2.js 필터를 테스트하려고 한다.이 필터는 단순히 날짜 형식을 전달된 날짜에 적용한다. 다테필터.js import Vue from 'vue'; import moment from 'moment'; const dateFormatter = (dateValue, dateFormat) => { return moment(dateValue).format(dateFormat); }; Vue.filter('date', dateFormatter); export default dateFormatter; 그래서 여기 3개의 유효한 단위 테스트가 있다. DateFilte..

programing 2022.04.10

VueJS는 돔에서 특정 요소 선택

VueJS는 돔에서 특정 요소 선택 JQuery 없이 VueJS를 사용하여 DOM에서 특정 요소를 선택할 수 있는 방법이 궁금함 내 구성 요소에는 다음과 같은 메서드 함수가 있다. $(".u-loc input").focusin(function() { $(".u-loc-icon").addClass('blue-active'); }); 유일한 문제는 동적으로 생성되어 1개 또는 10개의 다른 기능을 가질 수 있다는 점인데, 이는 각각의 동적으로 유니크 셀렉터를 사용해야 한다는 것을 의미한다. 그래서 나는 덧붙였다.:ref="'u-loc' + index" 그 말은 이제 다음 방법으로 원소를 타깃으로 삼을 수 있다는 겁니다.$(this.$refs['u-loc' + index]); 하지만 내가 어떻게 셀렉터를 이렇..

programing 2022.04.10

vuejs의 jquery css에 대한 대안

vuejs의 jquery css에 대한 대안 나는 부에즈를 배우고 모든 것을 jquery 없이 하려고 노력하고 있다. 나는 css 스타일의 라인하이크를 구해야 한다.Jquery에서 나는 다음과 같이 하곤 했다. let x = $(this).css("line-height"); vuejs 2.5를 사용하여 이 값을 얻는 방법은? 나는 탐험하고 있었다.this.$el이 구조에서 이 값을 얻을 수 있는 해결책을 찾을 수 없음: data: function () { return { lineHeight: null } }, mounted(){ this.lineHeight = ? } tl;dr // with jQuery: $(this).css("line-height"); // with Vue: mounted() { th..

programing 2022.04.10
반응형