记 2

357 阅读3分钟

问题一

微信小程序video报错 Failed to load media xxx #devtools_no_referrer

video在控制台报错,但是模拟器正常显示播放,

解决方法

1.清理缓存
2.可能是你链接错了
3.在开发者工具-设置-代理设置-不设置代理

学习一 混合使用nvue和vue

nvue的适用场景 www.w3cschool.cn/uni_app/uni…

nvue是为了性能优化而创建的,它不支持Vue的单文件组件(SFC),但你可以在nvue页面中使用App的全局样式和全局script的JS代码。

  1. 使用全局script:你可以在main.jsApp.vue中编写全局的Vue代码,然后在nvue页面中引用。但这种方法并不能让你在nvue页面中使用Vue单文件组件。

  2. 使用条件编译:如果你需要在Vue页面中使用某些nvue特有的API或组件,你可以使用条件编译来区分不同页面的代码。

#ifdef APP-NVUE
    <text>这是nvue特有的text组件</text>
#endif
  1. 使用Vue的mixin:你可以创建一个mixin,在mixin中包含可复用的功能,然后在nvue页面中使用。
// 在main.js中
Vue.mixin({
  methods: {
    sharedMethod() {
      // 可复用的方法
    }
  }
})
 
// 在nvue页面中
export default {
  methods: {
    // 调用mixin中的方法
    ...Vue.prototype.sharedMethod()
  }
}
  1. store属性与实例不同步,可以在App.vue中,将store绑定到uni上,在js文件中直接使用uni.$store进行操作 通过vue.prototype绑定的全局方法或属性,在nvue中获取到的是undefined;可进行同样操作进行绑定
import App from './App'
import store from '@/store'

uni.$store = store
  1. 如果你需要在vue中去调用自己定义的原生模块的功能,或者组件的话,那么肯定要注意。这个时候你应该用nvue,而不是vue ,用vue会导致调用不起来。
  2. nvue 页面的布局排列方向默认为竖排column,如需改变布局方向,可以在 manifest.json -> app-plus -> nvue -> flex-direction 节点下修改,仅在 uni-app 模式下生效
  3. 文字内容,必须、只能在<text>组件下。不能在<div>、<view>的text区域里直接写文字。否则即使渲染了,也无法绑定js里的变量。
  4. 布局不能使用百分比、没有媒体查询**。
  5. nvue 切换横竖屏时可能导致样式出现问题,建议有 nvue 的页面锁定手机方向。
  6. css选择器支持的比较少只能使用 class 选择器。class 进行绑定时只支持数组语法。不支持复合样式,不支持简写。
  7. nvue 的各组件在安卓端默认是透明的,如果不设置background-color,可能会导致出现重影的问题。
  8. Android端在一个页面内使用大量圆角边框会造成性能问题,尤其是多个角的样式还不一样的话更耗费性能。应避免这类使用。
  9. nvue页面没有****bounce 回弹效果,只有几个列表组件有bounce效果,包括 list、recycle-list、waterfall。
  10. App.vue 中定义的全局js变量不会在 nvue 页面生效。globalData和vuex是生效的。
  11. App.vue 中定义的全局css,对nvue和vue页面同时生效。如果全局css中有些css在nvue下不支持,编译时控制台会报警,建议把这些不支持的css包裹在条件编译里,APP-PLUS-NVUE
  12. 不能在 style 中引入字体文件,nvue 中字体图标的使用参考:加载自定义字体。如果是本地字体,可以用plus.io的API转换路径。