vue-frame

Dynamic component for rapid creation of interfaces
17,674 47
vue component iframe
Install
npm install vue-frame
Latest Version:1.0.7
Vue:2
Last Updated:Mar 3, 2018
Links: GitHub  ·  npm
Maintainer: anlijudavid

Vue-frame

Build Status npm version npm GitHub stars

A simple component Vue 2.x for prototyping interfaces with iframes.

Install

Using npm:

npm install --save vue-frame

Using yarn:

yarn add vue-frame

Import

import VueFrame from 'vue-frame'
export default {
  components: { VueFrame },
  data () {
    return { /*...*/ }
  },
  methods: { /*...*/ }
}

Usage

This is a project for vue.

<div id="vue-frame">
   <vue-frame text="VueJS" url="https://vuejs.org" frame="myframe" type="button" class="form-control"></vue-frame>
   <vue-frame text="Api Vue" url="https://vuejs.org/v2/api" frame="myframe" type="a"></vue-frame>
   <br />

   <iframe id="myframe" width="800"></iframe>
</div>

<script src="/dist/vue-frame.js"></script>

The rendered elements look like this:

CURRENTLY RECORDING

PropTypes

Prop Desc Type Default Is Required
class Custom class to add to the component string
url Custom url that the component will load string ✅
text Custom text string ✅
frame Iframe element ID string ✅
type Name of the HTML tag to render string a
default load site instantly mount the element boolean false
Example
<vue-frame text="VueJS" url="https://juliandavidmr.github.io" frame="idframe" type="div" class="form-control"></vue-frame>
Use CDN
<script src="https://unpkg.com/vue-frame@1.0.6/dist/vue-frame.js"></script>

See example with cdn index.html

Development

Command Description
npm run build Build
npm run dev Open browser dev

Contributing

License

MIT @juliandavidmr

Related Packages

vuex-iframe-sync

Vuex state synchronization between iframe/window

5,696 102
iframe sync vuex
@koumoul/v-iframe

Iframes with aspect ratio, iframe resizer integration and some corner cases.

4,186 3
iframe responsive vuejs
@capitalos/vue

Vue SDK for CapitalOS

2,229
iframe vue capitalos sdk
vue3-youtube

Wrapper for YouTube IFrame Player API

346,556 33
iframe vue api vue3 youtube
vue-safe-iframe

Safely include html in a iframe

13,709 3
iframe vue container html safe

Version History

Version Released License
1.0.7
1.0.6
1.0.5
1.0.4
1.0.3