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

remove three injection

This commit is contained in:
Kevin Levron 2021-04-21 21:35:43 +02:00
parent d91ba988ed
commit 3ccf67d7b1
9 changed files with 10 additions and 18 deletions

View File

@ -3,7 +3,7 @@ import useCannon from './useCannon.js';
// import { bindProp } from '../../tools'; // import { bindProp } from '../../tools';
export default defineComponent({ export default defineComponent({
inject: ['three', 'scene', 'renderer'], inject: ['renderer', 'scene'],
props: { props: {
gravity: { type: Object, default: () => ({ x: 0, y: 0, z: -9.82 }) }, gravity: { type: Object, default: () => ({ x: 0, y: 0, z: -9.82 }) },
broadphase: { type: String }, broadphase: { type: String },

View File

@ -16,6 +16,7 @@ export default defineComponent({
const renderer = inject('renderer') as RendererInterface const renderer = inject('renderer') as RendererInterface
return { renderer } return { renderer }
}, },
render() { render() {
return this.$slots.default ? this.$slots.default() : [] return this.$slots.default ? this.$slots.default() : []
}, },

View File

@ -2,11 +2,9 @@ import { Object3D, Scene } from 'three'
import { ComponentPublicInstance, defineComponent, inject, watch } from 'vue' import { ComponentPublicInstance, defineComponent, inject, watch } from 'vue'
import { bindProp } from '../tools' import { bindProp } from '../tools'
import { RendererInterface } from './Renderer' import { RendererInterface } from './Renderer'
import { ThreeInterface } from './useThree'
export interface Object3DSetupInterface { export interface Object3DSetupInterface {
renderer: RendererInterface renderer: RendererInterface
three: ThreeInterface
scene: Scene scene: Scene
o3d?: Object3D o3d?: Object3D
parent?: ComponentPublicInstance parent?: ComponentPublicInstance
@ -21,14 +19,13 @@ export interface Object3DInterface extends Object3DSetupInterface {
export function object3DSetup(): Object3DSetupInterface { export function object3DSetup(): Object3DSetupInterface {
const renderer = inject('renderer') as RendererInterface const renderer = inject('renderer') as RendererInterface
const three = inject('three') as ThreeInterface
const scene = inject('scene') as Scene const scene = inject('scene') as Scene
return { three, scene, renderer } return { scene, renderer }
} }
export default defineComponent({ export default defineComponent({
name: 'Object3D', name: 'Object3D',
inject: ['renderer', 'three', 'scene'], inject: ['renderer', 'scene'],
emits: ['created', 'ready'], emits: ['created', 'ready'],
props: { props: {
position: { type: Object, default: () => ({ x: 0, y: 0, z: 0 }) }, position: { type: Object, default: () => ({ x: 0, y: 0, z: 0 }) },

View File

@ -157,7 +157,6 @@ export default defineComponent({
provide() { provide() {
return { return {
renderer: this, renderer: this,
three: this.three,
} }
}, },
mounted() { mounted() {

View File

@ -23,9 +23,7 @@ export default defineComponent({
} }
}, },
created() { created() {
if (!this.renderer.scene) {
this.renderer.scene = this.scene this.renderer.scene = this.scene
}
}, },
methods: { methods: {
add(o: Object3D) { this.scene.add(o) }, add(o: Object3D) { this.scene.add(o) },

View File

@ -1,24 +1,21 @@
import { Pass } from 'three/examples/jsm/postprocessing/Pass' import { Pass } from 'three/examples/jsm/postprocessing/Pass'
import { defineComponent, inject } from 'vue' import { defineComponent, inject } from 'vue'
import { RendererInterface } from '../core/Renderer' import { RendererInterface } from '../core/Renderer'
import { ThreeInterface } from '../core/useThree'
import { EffectComposerInterface } from './EffectComposer' import { EffectComposerInterface } from './EffectComposer'
interface EffectSetupInterface { interface EffectSetupInterface {
renderer: RendererInterface renderer: RendererInterface
three: ThreeInterface
composer: EffectComposerInterface composer: EffectComposerInterface
pass?: Pass pass?: Pass
} }
export default defineComponent({ export default defineComponent({
inject: ['renderer', 'three', 'composer'], inject: ['renderer', 'composer'],
emits: ['ready'], emits: ['ready'],
setup(): EffectSetupInterface { setup(): EffectSetupInterface {
const renderer = inject('renderer') as RendererInterface const renderer = inject('renderer') as RendererInterface
const three = inject('three') as ThreeInterface
const composer = inject('composer') as EffectComposerInterface const composer = inject('composer') as EffectComposerInterface
return { renderer, three, composer } return { renderer, composer }
}, },
created() { created() {
if (!this.composer) { if (!this.composer) {

View File

@ -14,7 +14,7 @@ export interface MaterialInterface extends MaterialSetupInterface {
} }
export default defineComponent({ export default defineComponent({
inject: ['three', 'mesh'], inject: ['mesh'],
props: { props: {
color: { type: [String, Number], default: '#ffffff' }, color: { type: [String, Number], default: '#ffffff' },
depthTest: { type: Boolean, default: true }, depthTest: { type: Boolean, default: true },

View File

@ -28,7 +28,7 @@ export default defineComponent({
this.onPointerDown || this.onPointerDown ||
this.onPointerUp || this.onPointerUp ||
this.onClick) { this.onClick) {
this.three.addIntersectObject(this.mesh) this.renderer.three.addIntersectObject(this.mesh)
} }
this.initObject3D(this.mesh) this.initObject3D(this.mesh)

View File

@ -59,7 +59,7 @@ const Mesh = defineComponent({
this.onPointerDown || this.onPointerDown ||
this.onPointerUp || this.onPointerUp ||
this.onClick) { this.onClick) {
this.three?.addIntersectObject(mesh) this.renderer.three.addIntersectObject(mesh)
} }
this.mesh = mesh this.mesh = mesh