mirror of
https://github.com/troisjs/trois.git
synced 2024-11-24 04:12:02 +08:00
refactor box
This commit is contained in:
parent
85d220f4f8
commit
98a8c01ef1
@ -1,24 +1,30 @@
|
||||
import { BoxGeometry } from 'three';
|
||||
import Geometry from './Geometry.js';
|
||||
|
||||
export const props = {
|
||||
size: Number,
|
||||
width: { type: Number, default: 1 },
|
||||
height: { type: Number, default: 1 },
|
||||
depth: { type: Number, default: 1 },
|
||||
widthSegments: { type: Number, default: 1 },
|
||||
heightSegments: { type: Number, default: 1 },
|
||||
depthSegments: { type: Number, default: 1 },
|
||||
};
|
||||
|
||||
export function createGeometry(comp) {
|
||||
if (comp.size) {
|
||||
return new BoxGeometry(comp.size, comp.size, comp.size, comp.widthSegments, comp.heightSegments, comp.depthSegments);
|
||||
} else {
|
||||
return new BoxGeometry(comp.width, comp.height, comp.depth, comp.widthSegments, comp.heightSegments, comp.depthSegments);
|
||||
}
|
||||
};
|
||||
|
||||
export default {
|
||||
extends: Geometry,
|
||||
props: {
|
||||
size: Number,
|
||||
width: { type: Number, default: 1 },
|
||||
height: { type: Number, default: 1 },
|
||||
depth: { type: Number, default: 1 },
|
||||
widthSegments: { type: Number, default: 1 },
|
||||
heightSegments: { type: Number, default: 1 },
|
||||
depthSegments: { type: Number, default: 1 },
|
||||
},
|
||||
props,
|
||||
methods: {
|
||||
createGeometry() {
|
||||
let w = this.width, h = this.height, d = this.depth;
|
||||
if (this.size) {
|
||||
w = this.size; h = this.size; d = this.size;
|
||||
}
|
||||
this.geometry = new BoxGeometry(w, h, d, this.widthSegments, this.heightSegments, this.depthSegments);
|
||||
this.geometry = createGeometry(this);
|
||||
},
|
||||
},
|
||||
};
|
||||
|
@ -1,22 +1,13 @@
|
||||
import { BoxBufferGeometry } from 'three';
|
||||
import { watch } from 'vue';
|
||||
import Mesh from './Mesh.js';
|
||||
import { props, createGeometry } from '../geometries/BoxGeometry.js';
|
||||
|
||||
export default {
|
||||
extends: Mesh,
|
||||
props: {
|
||||
size: Number,
|
||||
width: { type: Number, default: 1 },
|
||||
height: { type: Number, default: 1 },
|
||||
depth: { type: Number, default: 1 },
|
||||
widthSegments: { type: Number, default: 1 },
|
||||
heightSegments: { type: Number, default: 1 },
|
||||
depthSegments: { type: Number, default: 1 },
|
||||
},
|
||||
props,
|
||||
created() {
|
||||
this.createGeometry();
|
||||
|
||||
['size', 'width', 'height', 'depth', 'widthSegments', 'heightSegments', 'depthSegments'].forEach(prop => {
|
||||
Object.keys(props).forEach(prop => {
|
||||
watch(() => this[prop], () => {
|
||||
this.refreshGeometry();
|
||||
});
|
||||
@ -24,11 +15,7 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
createGeometry() {
|
||||
if (this.size) {
|
||||
this.geometry = new BoxBufferGeometry(this.size, this.size, this.size);
|
||||
} else {
|
||||
this.geometry = new BoxBufferGeometry(this.width, this.height, this.depth);
|
||||
}
|
||||
this.geometry = createGeometry(this);
|
||||
},
|
||||
},
|
||||
__hmrId: 'Box',
|
||||
|
Loading…
Reference in New Issue
Block a user