Как заставить компонент vue-particles обновляться на значения из input?

Telegram dou#techПідписуйтеся на Telegram-канал «DOU #tech», щоб не пропустити нові технічні статті.

Сейчас данные из input перезаписываются в компонент, но графически это никак не отображается.

<template>	
	<div class="row wrap-banner">
		<vue-particles 	
			:particlesNumber="pNum"			
			:moveSpeed="mSpeed"		
			>				
		</vue-particles>
		<div class="col-md-7 skills-content ">
				<h1>Professional skills</h1>
				<ul>
					<li v-for="skill in skills">{{ skill }}</li>
				</ul>
		</div>	
		<div class="col-md-5">
			<form class="p-4">
				<div class="form-row">
					<div class="col-12 text-center">
						<h4>Particles options</h4>
					</div>
					<div class="form-group col-12 col-md-6">
						<label for="pNum">pNum</label>
						<input type="number" class="form-control myInput" 						 
						name="pNum"
						v-model.number="pNum"						
						/>
						<p>{{pNum}}</p>
					</div>
					<div class="form-group col-12 col-md-6">
						<label for="mSpeed">mSpeed</label>
						<input type="number" class="form-control myInput" 						 
						name="mSpeed"
						v-model.number="mSpeed"						
						/>
						<p>{{mSpeed}}</p>
					</div>
					<div class="col-md-12">
						<button class="btn btn-pink" type="button">Apply</button>
					</div>
				</div>
			</form>
		</div>		
	</div>		
</template>
<script>
import {mapGetters} from 'vuex';
  export default { 
        props: [
  	    'particlesNumber', 'moveSpeed'],
  	data(){
  		return {
  			pNum: 150,
  		    mSpeed: 4	    
  		}
  	},
  	 computed: {
	      ...mapGetters('skills', {
	        skills: 'skills',
	      }) 
    }
  }
</script>	
vue-particles — github.com/creotip/vue-particles
👍ПодобаєтьсяСподобалось0
До обраногоВ обраному0
LinkedIn
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Дозволені теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter

Додайте код vue-particles, тоді можна буде більш точно оцінити, чому в vue-particles не змінюється значення.
Можливо в vue-particles присвоєння відбувається якось так:

props: ['particlesNumber'],
data: function () {
    return {
        val: this.particlesNumber
    }
}

там на маунте инитится либа particles.js которая собственнр все и делает, а на обновления пропс там ниче не будет происходит

Підписатись на коментарі