????PC端admin文章手機預覽(VueCli3.x+TypeScript)

vue-phone-preview

適用于pc端后臺管理系統(tǒng)手機預覽

A VueCli3.x+TypeScript Toolkit for Web.

demo
github傳送門

Demo pictures

Install

$ npm i --save vue-phone-preview
or
$ yarn add vue-phone-preview

Quick Start

import Vue from 'vue'
import VuePhonePreview from 'vue-phone-preview';

Vue.use(VuePhonePreview)
@Component()
// or
import VuePhonePreview from 'vue-phone-preview'

@Component({
  components: {
    VuePhonePreview
  }
})
/**
 * 使用方法 
 * ①、如果使用第一種方法,從其他微信編輯器(135或者word文檔等等)
 * 需要先把圖片上傳至第三方圖片服務器,然后獲取圖片鏈接復制到文檔里
 * 例如:private content = '<img src="http://file.haoxinqing.cn/group1/M00/11/61/Chw4wFwAlz2AX_iqAABOSgaernE854.jpg" style=" max-width: 100%; height: auto;">'
 * ②、就是iframe的形式,導入的是一個m端鏈接
 */ 
①、<vue-phone-preview :content="content"></vue-phone-preview>
②、<vue-phone-preview :url="`https://mp.haoxinqing.cn`"></vue-phone-preview>
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

友情鏈接更多精彩內容