10
votos
Aceito
VUE filtro de valor no v-for
Você pode usar o computed para resolver o problema.
Assim:
new Vue({
el: '#app',
data: {
meus_valores: [/** **/]
},
computed: {
meus_valores_filtrados: function (...
5
votos
Aceito
Variáveis no App.vue
Uma maneira de fazer, se no caso você possui um <router-view> no seu App.vue, e o componente que você está emitindo o evento de preenchimento do 'Teste Cliente' estiver um nível abaixo apenas, ...
5
votos
Aceito
Como deletar um item de um objeto usando um ID interno (Vue-2)
Uma maneira de fazer isso seria percorrer toda a lista até encontrar o id procurado, para então remover esse elemento, segue um exemplo
<div id="app">
<div v-for="(item, index) in lista" ...
4
votos
Aceito
Converter strings em CamelCase para kebab-case
Creio que o que queres é converter strings em CamelCase para kebab-case,
podes fazer isso assim:
function camelCaseToKebabCase(str) {
return str.replace(/([a-zA-Z])(?=[A-Z])/g, '$1-')....
4
votos
Aceito
Vue 2: Pegar valor do input sem usar v-model
Não recomendo de forma alguma essa mesclagem de php puro com vue, existem soluções melhores, mas é possível pegar o value pelo event.target.value, exemplo...
new Vue({
el: '#app',
data : {
...
3
votos
Aceito
Como desabilitar um link de forma condicional com bind href no vue.js?
Você pode usar condições dentro do bind. Ex: (condição ? if : else)
No seu caso ficaria assim:
<a v-bind:href="(opts.level >= 2 ? 'http://meusite.com.br/' + opts.cod : '#')">
Coloquei >= 2 ...
3
votos
Aceito
Não é possível utilizar diretiva v-for sobre prop passada ao componente do Vue
Você esta tendo problemas para renderizar pois esta usando DOM Template, de uma olhada na documentação sobre as particularidades de DOM Templates.
Basicamente, você precisa usar o atributo is. Como &...
3
votos
Aceito
Limpar dados do v-model do VUE de uma só vez
Você terá que limpar um por um, mas uma opção é colocar os atributos do form dentro de objeto separado no data. Assim, você acessa eles por this.fields.campo1 etc.., e pode iterar o objeto limpando ...
3
votos
Gerar quebra de linha no VueJS com v-if
Vejo duas soluções práticas para seu problema:
1. Solução mediana
Criar uma computed property que forneça um array de arrays, onde cada array "filho" tenha 3 elementos apenas. Ex.:
new ...
3
votos
Aceito
Diferença entre props e propsData
Ambos são a mesma coisa mas em fazes diferentes da vida do componente.
Quando defines o componente ele precisa de ter algumas das propriedades estruturais de um componente Vue, como props, data, ...
3
votos
Diretivas Personalizadas
Edit01
Se entendi certo oque você precisa, temos isso na documentação do VueJs
https://br.vuejs.org/v2/guide/custom-directive.html
Seria algo como isso:
<div v-arthur="{ color: 'green', text: '...
3
votos
Aceito
Falha ao remover elemento array
Você pode utilizar o array.filter() para trazer apenas as sugestões com meu_voto === 'S':
this.meusVotos = this.sugestoesGeral.filter(sugestao => sugestao.meu_voto === 'S')
Documentação do array....
3
votos
Aceito
Reatividade de Objectos no VueJS (vuex)
Eu passei por problemas assim também, eu não sei exatamente dizer porque isso aocntece mas o vuex tem um problema com reactividade quando é feito de forma aninhada, no caso você está atualizando a ...
2
votos
Dificuldade para remover item de uma lista invertida no Vue
Olá
As mudanças que eu faria no código seriam adição de propriedade key no html e utilizar próprio item como referencia para remoção:
<!DOCTYPE html>
<html>
<head>
<meta ...
2
votos
Performance tipos de EventBus em Vuejs
Como o EventBus opera?
Comunicação entre componentes
Toda e qualquer comunicação entre componentes está disponível na instância do Vue e você pode encontra-los dando um console.log(this) dentro do ...
2
votos
Aceito
Como usar variaveis dinamicamente no vue
Para atingir exatamente o resultado que você deseja, mediante ao código, faltou apenas você colocar o :class ou v-bind:class que funcionará. Segue abaixo:
<div v-for="(value, propertyName) in user"...
2
votos
Como fazer debounce (consultar apenas depois de terminar de digitar no input) no VUEJS?
Resolvi publicar uma resposta para registrar a forma que resolvi o problema. Eu utilizei uma técnica de debounce para Javascript, baseando-se num setTimeout.
Veja:
new Vue({
el: '#app',
...
2
votos
Como fazer debounce (consultar apenas depois de terminar de digitar no input) no VUEJS?
Você pode fazer isso usando o vue-rx que integra o rxjs ao ciclo de vida dos componentes Vue.
Veja um exemplo funcionando: https://codesandbox.io/s/k011nv98kr
Código fonte do exemplo:
main.js
...
2
votos
Aceito
Como filtrar uma lista em vue com resposta ignorando acentos e maiúsculo/minúsculo?
Fiz uma junção dessa resposta Como fazer uma busca ignorando acentuação em JavaScript?, para normalizar os texto acentuados (removendo os acentos) e também colocando os valores todos em caixa baixa, e ...
2
votos
Erro ao passar props com objetos literais via v-bind="object"
Ao dar o v-bind você deve apontar a prop que deseja atribuir, e na interpolação usar a prop como objeto...
const blogPost = {
props: ['post'],
template: '\
<div>\
<...
2
votos
Aceito
Problemas ao usar o v-mask (Vue.JS)
Você está tentando usar a diretiva do v-mask mas está importando o plugin e não a diretiva.
Aqui está um exemplo funcionando:
main.js
import { VueMaskDirective } from "v-mask";
Vue.directive("mask",...
2
votos
Aceito
Como usar mais de 1 classe dinamica com vuejs?
Cria uma computed property que faça essa lógica. Na API do Vue podes retornar uma array com strings e objetos (parecido com o que estás a fazer no template), e ficaria assim:
No template:
<div :...
2
votos
Aceito
V-FOR não está funcionando no meu APP?
Problema solucionado inserindo uma div pai com a class="row" dentro do componente.
No arquivo index.html
<div class="container">
<div id="app">
<router-view></...
2
votos
Aceito
Inserir valor de Input como uma Option de um Select
Vou me focar na parte de adicionar um item na lista para que o seu select seja atualizado com o novo valor, ou seja, a sua lista que carrega o select a partir do momento da sua atualização ...
1
voto
Aceito
Classes, Mixins ou os Dois?
Não vejo muito a vantagem de se usar uma classe só com getters e setters, mas vejo vantagem em usar os serviços, uma abordagem que ajudou a clarear mais as ideias com relação a isso foram esses dois ...
1
voto
Aceito
Acesso a valor de propriedade
mesas deve ser um array, não pode usar idMesa de forma repetida as chaves deve ser única em cada objecto
Forma errada
mesas={
idMesa:{}, //está repetir a chave
idMesa:{}
}
...
1
voto
Como fazer o "bind" de uma variável do Vue.js sem usar as chaves
Opa, fuçando na net esbarrei logo após inserir a questão aqui. A solução é a diretiva v-text como mostra nesse link ficando assim meu html:
<form id="foo" v-on:submit.prevent>
<div>
...
1
voto
Aceito
Inserir component depois da renderização Vue.js
O VueJS possui um ciclo de vida próprio. https://br.vuejs.org/v2/guide/instance.html na própria documentação ele explica os métodos que controlam esse ciclo de vida. Ao invés de usar o Jquery, o ...
1
voto
Aceito
VueJS2 Atualização de Diretivas
tente setar o valor à ser formatado como valor da diretiva.
var intl = new Intl.NumberFormat('pt-BR', { style: 'currency', currency: 'BRL' })
Vue.directive('money', {
bind: function (el, ...
1
voto
Aceito
Performance tipos de EventBus em Vuejs
Quanto ao mecanismo do EventBus, em ambos os casos eles são iguais, o que muda é a forma de que como se acessa o mesmo.
O segundo caso, o que é definido um plugin que irá injetar à $bus ao prototype ...
Only top scored, non community-wiki answers of a minimum length are eligible
Tags relacionadas
vue.js-2 × 83vue.js × 70
javascript × 38
vuetify × 8
vuex × 4
front-end × 3
laravel × 2
componentes × 2
vue-router × 2
quasar × 2
php × 1
html × 1
jquery × 1
css × 1
html5 × 1
array × 1
.net × 1
node.js × 1
typescript × 1
firebase × 1
google-maps × 1
data × 1
objetos × 1
arraylist × 1
get × 1