diff --git a/README.md b/README.md
index c3a58a5..4d02bd0 100644
--- a/README.md
+++ b/README.md
@@ -46,6 +46,19 @@ const CustomElement = wrap(Vue, () => import(`MyComponent.vue`))
window.customElements.define('my-element', CustomElement)
```
+### Usage with addtional attributes
+```js
+const vueAttributeBeforeRender = {
+ i18n:{ locale: 'de' },
+ foo:{ bar: 'test' },
+};
+
+const CustomElement = wrap(Vue, Component, vueAttributeBeforeRender)
+```
+This will add the attribute to the
+```js
+new Vue({ // attributes })
+```
## Interface Proxying Details
diff --git a/src/index.js b/src/index.js
index 4409bd7..13a6f2f 100644
--- a/src/index.js
+++ b/src/index.js
@@ -9,7 +9,7 @@ import {
convertAttributeValue
} from './utils.js'
-export default function wrap (Vue, Component) {
+export default function wrap (Vue, Component, vueAttributeBeforeRender) {
const isAsync = typeof Component === 'function' && !Component.cid
let isInitialized = false
let hyphenatedPropsList
@@ -83,23 +83,28 @@ export default function wrap (Vue, Component) {
const self = super()
self.attachShadow({ mode: 'open' })
- const wrapper = self._wrapper = new Vue({
- name: 'shadow-root',
- customElement: self,
- shadowRoot: self.shadowRoot,
- data () {
- return {
- props: {},
- slotChildren: []
+ const wrapper = self._wrapper = new Vue(
+ Object.assign(
+ vueAttributeBeforeRender, {
+ name: 'shadow-root',
+ customElement: self,
+ shadowRoot: self.shadowRoot,
+
+ data () {
+ return {
+ props: {},
+ slotChildren: []
+ }
+ },
+
+ render (h) {
+ return h(Component, {
+ ref: 'inner',
+ props: this.props
+ }, this.slotChildren)
+ }
}
- },
- render (h) {
- return h(Component, {
- ref: 'inner',
- props: this.props
- }, this.slotChildren)
- }
- })
+ ))
// Use MutationObserver to react to future attribute & slot content change
const observer = new MutationObserver(mutations => {
pFad - Phonifier reborn
Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.
Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.
Alternative Proxies:
Alternative Proxy
pFad Proxy
pFad v3 Proxy
pFad v4 Proxy