{"_id":"@ahcui/vue3-components-url-loader","name":"@ahcui/vue3-components-url-loader","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@ahcui/vue3-components-url-loader","version":"1.0.0","description":"VUE3组件-可载入url页面的vue组件","author":{"name":"zerostyle"},"email":"zerostyle@126.com","private":false,"main":"dist/vue3-components-url-loader.umd.min.js","license":"MIT","keywords":["@ahcui","vue3-components-url-loader","url-loader","page-loader"],"homepage":"https://gitee.com/ahcui/vue3-components-url-loader/blob/v1.0.0/README.md","bugs":{"url":"https://gitee.com/ahcui/vue3-components-url-loader/issues"},"repository":{"type":"git","url":"https://gitee.com/ahcui/vue3-components-url-loader.git"},"scripts":{"build":"webpack --config webpack.conf.js","pack":"npm pack","unpub:1.0.0":"npm unpublish @ahcui/vue3-components-url-loader@1.0.0","pub:1.0.0":"npm publish --access public"},"dependencies":{"vue":"^3.2.33","vue-router":"^4.0.15"},"devDependencies":{"@babel/core":"^7.8.7","@babel/plugin-proposal-decorators":"^7.14.2","@babel/plugin-syntax-jsx":"^7.12.13","@babel/plugin-transform-runtime":"^7.8.3","@babel/preset-env":"^7.8.4","@babel/runtime":"^7.14.0","@babel/runtime-corejs3":"^7.16.3","babel-loader":"^8.2.2","core-js":"^3.14.0","eslint":"^7.27.0","webpack":"5.64.1","webpack-cli":"^4.7.0","vue-loader":"^16.8.3","vue-style-loader":"^4.1.3","vue-template-compiler":"^2.6.12","css-loader":"^5.2.6","url-loader":"^3.0.0","postcss":"8.3.0","postcss-import":"^14.0.0","postcss-loader":"^5.3.0","css-minimizer-webpack-plugin":"3.0.1","mini-css-extract-plugin":"^2.6.0"},"eslintConfig":{"root":true,"env":{"node":true},"extends":["plugin:vue/essential","eslint:recommended"],"rules":{},"parserOptions":{"parser":"babel-eslint"}},"browserslist":["> 1%","last 2 versions","not ie <= 8"],"gitHead":"110c4d0e941ebb85a129f9162ad532e29afceaab","_id":"@ahcui/vue3-components-url-loader@1.0.0","_nodeVersion":"16.15.0","_npmVersion":"6.14.15","dist":{"integrity":"sha512-yEf6zaHmJ/IyFkZ9nqogIf0eyaKujo0GSKLhuyM2nbnZBTmKmZHqgBgYL/hiSKiWt0pZv6Hlw/xlzETB3BSbEQ==","shasum":"31d18f889d9f68dc51b734c3c8660a276342947b","tarball":"https://registry.npmjs.org/@ahcui/vue3-components-url-loader/-/vue3-components-url-loader-1.0.0.tgz","fileCount":4,"unpackedSize":31643,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC7NmWvIf0fJPm4zBC3dJxNrngILI9tEPx2v7/7BWcLqQIhAMtb320F6YBVP13/YmWSnHXrLfleMmJGO4ZMMfu3e7h4"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJi1lftACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr5sRAAifsntdyVK4+utJy5f+nNDssDEetAsNeUKH8rolin5c1Wo1VU\r\nDb9ybGSo+An0WrVQaKIOW4mOf36u3Myi80TlTcogronWnb63rDKekyYUngfh\r\nuXep3vQ5eSiCoiQcJarq9o3jjviD3Kqt8zXujIk4nw/4ptW7XAS42fgtIsef\r\nK0Awg5snln/CiYtj5Mg+smEK4zPdR6sNhZ8M48UsCTtVK/s616g43u0s6tKb\r\n454dHxxD5m0jqwqsp6B99ep8M5yXEhTrJDbimq/INXcw65jfmtQKFHrqPLLI\r\njCv23H5g39Ynq+kVJYdoiIE4SK6rnYcoeI5N7aoEqOIMILMssbI1tST/QT9G\r\n6n50SVKj9FAL5ITAHAa/OsYP0L52isTsXIDGmkJceZEsZBKOqF7stsBlDiH2\r\nCxnYvfBeTYVcl0m0PpS5QQCoXd6I7dqwNSGiuj3xVdcjajm3YG6/GeuUmv6e\r\nOhgWl/MHVxREyB5DJVuG23SbZjmJ/6g5rjNTnFBilENrALXTve2hxjHGuIP5\r\nc++rmasX3DT7/7/Cd/N8zbyZL6Y5Zx4Yng/Y830tyS8flxrkahGPrADr7BBW\r\n+wOkKQumuhEdetTMmtb8jVz6btkO/aGrNmiT7PKD0pVe4VTW7vIR+XakZ6ER\r\nwYMMogTRJfRhrJHGfbkJdJYmXLYzMe9CMZk=\r\n=+Leq\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"zero_style","email":"zerostyle@126.com"},"directories":{},"maintainers":[{"name":"zero_style","email":"zerostyle@126.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue3-components-url-loader_1.0.0_1658214381664_0.04451224874852722"},"_hasShrinkwrap":false}},"time":{"created":"2022-07-19T07:06:21.599Z","1.0.0":"2022-07-19T07:06:21.863Z","modified":"2022-07-19T07:06:21.999Z"},"maintainers":[{"name":"zero_style","email":"zerostyle@126.com"}],"description":"VUE3组件-可载入url页面的vue组件","homepage":"https://gitee.com/ahcui/vue3-components-url-loader/blob/v1.0.0/README.md","keywords":["@ahcui","vue3-components-url-loader","url-loader","page-loader"],"repository":{"type":"git","url":"https://gitee.com/ahcui/vue3-components-url-loader.git"},"author":{"name":"zerostyle"},"bugs":{"url":"https://gitee.com/ahcui/vue3-components-url-loader/issues"},"license":"MIT","readme":"<h1 align=\"center\">@ahcui/vue3-components-url-loader</h1>\n\n### **一个可以加载html页面的vue3组件** \n\n##### 组织：ahcui\n\n##### @ahcui/vue3-components-url-loader 是一个可加载页面的vue组件。\n\n\n\n### **当前版本:** 1.0.0 (支持 Vue 3)\n\n\n\n[ **[在线演示](http://www.ahcui.com/) | \n[使用示例](https://gitee.com/ahcui/vue3-multiplex-project)** ]\n\n\n\n## 特性\n\n* 加载html页面\n* 通过props传入url参数\n* 可监听页面中url参数\n* 无边框\n* 样式重写与覆盖\n\n\n\n## 入门指南\n\n### 安装\n\n#### npm\n\n    # 使用 npm    \n\tnpm install @ahcui/vue3-components-url-loader --save\n    \n\n### 引入\n\n* npm方式引入\n\n```javascript\n    import UrlLoader from '@ahcui/vue3-components-url-loader';\n```\n\n加入到 Vue 组件 \n\n ```javascript\n    export default {\n        components: {\n           UrlLoader,\n       },\n    }\n    \n```  \n\n### 使用\n\t\n```html\n\n    <url-loader :url=\"url\" :watchQuery=\"watchQuery\" style=\"height:100%\" frameborder=\"1\" @frameloaded=\"frameloadedHandle\" @framemounted=\"framemountedHandle\"  >\n    </url-loader>\n```\n\n```javascript\n\t\n    import UrlLoader from '@ahcui/vue3-components-url-loader';\n\t\n\texport default {\n\t\tname: \"PageLoader\",\n\t\tcomponents:{UrlLoader},\n\t\tprops: {\n\t\t\turl:{\n\t\t\t\ttype: String,\n\t\t\t\tdefault:\"\"\n\t\t\t\t},\n\t\t\twatchQuery:{\n\t\t\t\ttype:Boolean,\n\t\t\t\tdefault:true\n\t\t\t\t},\n\t\t},\n\t\tsetup(){\n\t\t\tconst frameloadedHandle = () => {\n\t\t\t\tconsole.log(\"frameloadedHandle\");\n\t\t\t}\n\t\t\tconst framemountedHandle = () => {\n\t\t\t\tconsole.log(\"framemountedHandle\");\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tframeloadedHandle,\n\t\t\t\tframemountedHandle,\n\t\t\t}\n\t\t}\n\t}\n``` \n\n\n\n\n\n### 文档\n\n#### 属性\n\n\n* 要加载的url\n\n\t**url**<br/>\n\t{\n\t\ttype:String,\n\t\tdefault:\"\",\n\t},\n\t\n* 是否自动监听页面地址中的url参数切换页面\n\n\t**watchQuery:**<br/>{\n      type:Boolean,\n      default:true\n    }\n\t\n\t如组件所在的当前页面地址为：\n\t\n\thttp://localhost:8888/a/b/loadsrc?url=http%3A%2F%2Fnodejs.cn%2Fapi%2F\n\t\n\t若此值设为true，则自动监听url参数的值\n\t\n\t\n\t\t\n#### 事件\n\n   布局事件\n\n* **framemounted**\n\n    对应Vue生命周期 `Vue的mounted事件`\n\n```javascript\n    framemounted: function(iframe){\n      console.log(\"Vue组件PageLoader构建完成\")\n    }\n```\n\n* **frameloaded**\n\n    组件要加载的url页面加载完成事件`iframe的load事件`\n\n```javascript\n    frameloaded: function(iframe){\n      console.log(\"页面加载完成，同域的前提下您可以向iframe对象内部注入脚本处理\")\n    }\n```\n\n\n","readmeFilename":"README.md"}