# seFramePage。
> 即行内框架。

## 导入使用
```code[javascript]
import seFramePage from "ss-universal-client-web/comp/view/su-frame-page";
```

### 基础用法
> 支持网址 

:::demo 
```html
<template>
    <div style="height: 300px">
        <su-frame-page :src="src" :rtf-style="rtfStyle"></su-frame-page>
    </div>
    
</template>
<script>
// import seFramePage from "ss-universal-client-web/comp/view/su-frame-page";
export default {
    data(){
        return {
            src: 'http://wwwdev1.niceloo.com/',
            rtfStyle: {
                width: '100%',
                height: '100%'
            }           
        }
    },
    components:{
        seFramePage
    },
    methods: {
    }
};
</script>
```
:::

### 支持html
> 所有主流浏览器都支持 srcdoc 属性，除了 Internet Explorer。
如果浏览器支持 srcdoc 属性，则将覆盖在 src 属性中规定的内容。
如果浏览器不支持 srcdoc 属性，则相应地会显示在 src 属性（若已设置）中规定的文件。

:::demo 
```html
<template>
    <su-frame-page :rtf-content="rtfContent" :rtf-style="rtfStyle"></su-frame-page>
</template>
<script>
// import seFramePage from "ss-universal-client-web/comp/view/su-frame-page";
export default {
    data(){
        return {
            rtfContent: '',
            rtfStyle: {
                background: 'green',
            } 
        }
    },
    components:{
        seFramePage
    },
    created(){
        this.rtfContent = this.getRtfContent();
    },   
    methods: { 
        getRtfContent(){
            let content =  '<p>这是html标签<b style="color:red;">srcdoc</b> 属性显示得内容。</p>';
            return content;
        }      
    }
};
</script>
```
:::
### Attributes
| 参数      | 说明          | 类型      | 可选值                           | 默认值  |
|---------- |-------------- |---------- |--------------------------------  |-------- |
| src         | 显示的文档的 URL |String | - | - |
| rtf-content         | 显示的页面的富文本内容 |String | - | - |	
| rtf-style         | 富文本样式 |Object | - | - |
| append-to-body        | iframe是否插入至 body 元素上;默认true；false模式为文档流模式，可能存在白屏现象 |Boolean | - | false |