mpvue使用mpvue-entry后,引入原生开发组件

mpvue-entry是集中式页面配置,自动生成各页面的入口文件,优化目录结构,支持新增页面热更新

引入这个之后,目录下面就没了main.js

怎么引入原生开发的组件呢?

mpvue-entry 文档中写了,需要注意看

├─build
├─config
├─src
│ ├─components
│ ├─pages
│ │ └─news
│ │ │─list.vue
│ │ └─detail.vue
│ ├─App.vue
│ ├─main.js
│ └─pages.js
└─package.json

// pages.js文件
module.exports = [
  {
    path: 'pages/news/list', // 页面路径,同时是 vue 文件相对于 src 的路径,必填
    config: { // 页面配置,即 page.json 的内容,可选
      navigationBarTitleText: '文章列表',
      enablePullDownRefresh: true
      //这里加入需要引入的原生组件
	  usingComponents: {
		'painter': '/static/painter/painter'
	  }
	  
    }
  }
]
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
import-html-entry是一个JavaScript库,用于将HTML片段作为入口点动态导入到Web页面中。 通常情况下,我们使用<script>标签来加载和执行JavaScript文件。但是,当我们的页面需要动态加载和执行多个脚本文件时,使用<script>标签可能会变得非常繁琐。此时,import-html-entry就派上用场了。 通过import-html-entry,我们可以将HTML片段作为JavaScript模块进行导入。这使得我们可以将页面划分为多个模块,并在需要时动态地加载这些模块,而无需手动操作DOM或是管理多个<script>标签。 使用import-html-entry的步骤如下: 1. 在页面中引入import-html-entry库,例如:<script src="import-html-entry.js"></script>。 2. 在HTML片段中,我们可以使用特定的data-属性指定要加载的模块。例如,我们可以在<div data-entry="module.js"></div>中指定要加载的模块为module.js。 3. 在JavaScript文件中,我们可以使用importHTML函数来动态加载和执行HTML片段。例如,importHTML(document.querySelector('div[data-entry="module.js"]')).then(module => { // 执行相应操作 })。 通过以上步骤,我们可以动态地导入HTML片段,并在需要时加载和执行。这样,我们可以更好地管理和组织我们的代码,提高代码的可维护性和可扩展性。 总之,import-html-entry是一个方便实用的JavaScript库,它可以帮助我们动态地导入HTML片段作为入口点,在Web开发中具有很大的作用。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值