lightcordwarez
/
BetterDiscordApp-v2
mirror of https://github.com/JsSucks/BetterDiscordApp
1
0
Fork 0
Code Issues 3 Releases Wiki Activity

Add Vue wrapper for React

This commit is contained in:
Samuel Elliott 2018-06-10 21:22:01 +01:00
parent 204dd76e7b
commit 17597e2c30
No known key found for this signature in database
GPG Key ID: 8420C7CDE43DC4D6
2 changed files with 22 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/src/ui/commoncomponents.js
View File

@ -1,3 +1,5 @@
export { ReactComponent } from './vue';
export * from './components/common';
export { default as SettingsPanel } from './components/bd/SettingsPanel.vue';

21
client/src/ui/vue.js
View File

@ -8,9 +8,10 @@
* LICENSE file in the root directory of this source tree.
*/
import DOM from 'dom';
import { WebpackModules } from 'modules';
import Vue from 'vue';
import VTooltip from 'v-tooltip';
import DOM from './dom';
Vue.use(VTooltip, {
defaultContainer: 'bd-tooltips',
@ -44,4 +45,22 @@ Vue.use(VTooltip, {
}
});
export const ReactComponent = {
props: ['component', 'component-props', 'component-children', 'react-element'],
render(createElement) {
return createElement('div');
},
mounted() {
const { React, ReactDOM } = WebpackModules;
ReactDOM.unmountComponentAtNode(this.$el);
ReactDOM.render(this.reactElement || React.createElement(this.component, this.componentProps, ...(this.componentChildren || [])), this.$el);
},
beforeDestroy() {
WebpackModules.ReactDOM.unmountComponentAtNode(this.$el);
}
};
Vue.component('ReactComponent', ReactComponent);
export default Vue;