Skip to content

feat: mounting-portal component support mount to customized HTMLElement#278

Open
Ryqsky wants to merge 1 commit intoLinusBorg:developfrom
Ryqsky:feature/mount-to-el
Open

feat: mounting-portal component support mount to customized HTMLElement#278
Ryqsky wants to merge 1 commit intoLinusBorg:developfrom
Ryqsky:feature/mount-to-el

Conversation

@Ryqsky
Copy link
Copy Markdown

@Ryqsky Ryqsky commented Dec 3, 2019

when the HTMLElement comes form other iframe so that window.document.querySelector is different and inoperative

…nt (when the HTMLElement comes form other iframe so that window.document is different)
@cihad
Copy link
Copy Markdown

cihad commented Feb 29, 2020

@Ryqsky Is this can be an usage example:

<div id="app">
  <MountingPortal :mountTo="mountTo" name="source" append>
    <p>Content for the Target</p>
  </MountingPortal>
<div>

<aside id="widget" class="widget-sidebar">
  This Element is not controlled by our Vue-App,
  but we can create a <portal-target> here with <MountingPortal>.
</aside>

<script>
  new Vue({
    el: '#app',
    data() {
      return { mountTo: window['widget'] }
    },
  })
</script>

@Ryqsky
Copy link
Copy Markdown
Author

Ryqsky commented Mar 2, 2020

@Ryqsky Is this can be an usage example:

<div id="app">
  <MountingPortal :mountTo="mountTo" name="source" append>
    <p>Content for the Target</p>
  </MountingPortal>
<div>

<aside id="widget" class="widget-sidebar">
  This Element is not controlled by our Vue-App,
  but we can create a <portal-target> here with <MountingPortal>.
</aside>

<script>
  new Vue({
    el: '#app',
    data() {
      return { mountTo: window['widget'] }
    },
  })
</script>

@cihad
Can you provide an online address in https://codesandbox.io/ ?
Thanks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants