vColorPicker使用

1、装包

npm install vcolorpicker -S

2、main.js导入

// vue颜色插件
import vcolorpicker from 'vcolorpicker'
Vue.use(vcolorpicker)

3、页面使用

<colorPicker v-model="color" v-on:change="headleChangeColor"></colorPicker>
// 解释：headleChangeColor是颜色改变触发的函数

主页：http://vue-color-picker.rxshc.com/
Github：https://github.com/zuley/vue-color-picker

示例-修改vue3d图形颜色

data数据

data(){
  return {
  	scene2: null, // 场景二
	color: '#90a2b5',
	mesh2: null,
	vtkmaterial: null
  }
}

vtk文件设置

	this.vtkmaterial = new THREE.MeshLambertMaterial( { wireframe: false, morphTargets: false, side: THREE.DoubleSide, color: this.color } );
				this.vtkloader = new VTKLoader()
				this.vtkloader.load( "../../static/bone_1.vtk", geometry =>{
					console.log(geometry)
					geometry.computeVertexNormals();

					this.mesh2 = new THREE.Mesh( geometry, this.vtkmaterial ); // mesh 物体对象
					this.scene.add( this.mesh2 );

颜色改变触发函数

headleChangeColor(){
			console.log('颜色改变触发')
			console.log(this.vtkmaterial)
			this.mesh2.material.color.set(this.color)
		},