1
0
mirror of https://github.com/troisjs/trois.git synced 2024-11-24 04:12:02 +08:00

Uniforms working correctly

This commit is contained in:
Sander Moolin 2021-03-12 09:55:30 -05:00
parent 5bd7bcc70f
commit e9e2ac7bce

View File

@ -1,10 +1,11 @@
import { ShaderMaterial } from 'three' import { ShaderMaterial } from 'three'
import { watch } from 'vue';
import { propsValues, defaultFragmentShader, defaultVertexShader } from '../tools.js'; import { propsValues, defaultFragmentShader, defaultVertexShader } from '../tools.js';
export default { export default {
inject: ['three', 'mesh'], inject: ['three', 'mesh'],
props: { props: {
uniforms: Object, uniforms: { type: Object, default: () => { } },
vertexShader: { type: String, default: defaultVertexShader }, vertexShader: { type: String, default: defaultVertexShader },
fragmentShader: { type: String, default: defaultFragmentShader }, fragmentShader: { type: String, default: defaultFragmentShader },
}, },
@ -20,6 +21,16 @@ export default {
createMaterial() { createMaterial() {
this.material = new ShaderMaterial(propsValues(this.$props)); this.material = new ShaderMaterial(propsValues(this.$props));
}, },
addWatchers() {
['uniforms', 'vertexShader', 'fragmentShader'].forEach(p => {
watch(() => this[p], (value) => {
this.material[p] = value;
},
// only watch deep on uniforms
{ deep: p === 'uniforms' }
);
});
},
}, },
render() { render() {
return []; return [];