面试题总结1.1

关于MVVM

  • Model–View–ViewModel (MVVM) 是一个软件架构设计模式,由微软 WPF 和 Silverlight 的架构师
    Ken Cooper 和 Ted Peters 开发,是一种简化用户界面的事件驱动编程方式。由 John Gossman(同样也是 WPF
    和 Silverlight 的架构师)于2005年在他的博客上发表
  • MVVM分为三个部分:
  •  分别是M(Model,模型层 )泛指后端进行的各种业务逻辑处理和数据操控,对于前端来说就是后端提供的 api 接口。
    
  •  V(View,视图层),VM(ViewModel,控制器,V与M连接的桥梁)也就是用户界面。前端主要由 HTML 和 CSS 来构建 
    
  •  VVM 源自于经典的 Model–View–Controller(MVC)模式 ,MVVM的出现促进了前端开发与后端业务逻辑的分离,极大地提高了前端开发效率,MVVM 的核心是 ViewModel层,它就像是一个中转站(value converter),负责转换 Model中的数据对象来让数据变得更容易管理和使用,该层向上与视图层进行双向数据绑定,向下与 Model 层通过接口请求进行数据交互,起呈上启下作用
    

关于Object.defineProperty
Object.defineProperty可以再一个对象中定义或者修改一个属性,然后返回这个对象,并且可对该属性的可写行,可便利性,存取描述符(get、set)等进行设定,兼容性好,支持 IE9,而 Proxy 的存在浏览器兼容性问题,而且无法用 polyfill 磨平,因此 Vue 的作者才声明需要等到下个大版本( 3.0 )才能用 Proxy 重写
参数:Object.defineProperty(obj, prop, descriptor)
路由传参

  1. 父组件中:<router-link to="/需要跳转的路由路径/需要传递的参数"></router-link>
    子组件中:使用this.$route.params.num来接收路由参数
  2. 通过路由属性中的name来确定匹配的路由,通过params来传递参数
    在这里插入图片描述
    子组件接收
    在这里插入图片描述
    Webpack
    Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其打包为合适的格式以供浏览器使用。
    Webpack入门教程
    Bootstrap
    简洁、直观、强悍的前端开发框架。
    编译 Less/Sass 源码时需要使用 Autoprefixer 工具
    Bootstrap 利用 Autoprefixer 自动为 某些 CSS 属性添加针对特定厂商的前缀。如果你是从 Less/Sass 源码编译 Bootstrap 的,并且没有使用 Bootstrap 自带的 Gruntfile 文件,那你就必须将 Autoprefixer 集成到你的编译工具和编译过程中。如果你使用的是我们预先编译好的 Bootstrap 文件或者使用的是我们提供的 Gruntfile 文件,那就无需操心了,因为我们提供的 Gruntfile 中已经集成了 Autoprefixer。编译 CSS 和 JavaScript 文件。

H5和APP的交互
App内嵌H5页面:两种传值方式

	app给h5传值(方法主体由h5人员编写,移动端调用)
	h5给app传值 (方法主体由移动端人员编写,h5调用)

在h5调用Android方法时需要一个通讯桥梁,这个通讯桥梁的名字可两方协定

					//h5调用移动端的方法

//Android的调用方法
window.JSBright.getPrintData(this.clickchecknum);
//ios的调用方法:
window.webkit.messageHandlers.getPrintData.postMessage({
      params: this.clickchecknum,
});

					//移动端调用h5方法
window.getParams = this.getParams;

1 首先判断当前打开的页面是否在app中

 如果在app中,则进行之后的交互(与app人员约定一个方法名,方法由app人员去写)

如果不在app中,则判断环境进行下载的操作

2 下载的操作

-  区分是不是微信环境(android在微信中不能直接下载~,IOS会弹出提示,然后可直接跳转到appStore)

- 区分IOS/Android

     这是如果是Andorid环境,则需要自己添加遮罩层提示用户三方浏览器打开下载

vuex存储流程:
vuex五种属性,分别是State、 Getter、Mutation 、Action、Module

  • state 基本数据(储存数据数据)
  • getters 从基本数据(state)派生出来的数据,相当于state的计算属性,具有返回值的方法
  • mutations 提交更新数据的方法,同步(如果需要异步使用action),commit:同步操作,写法: this.$store.commit(‘mutations方法名’,值)
  • actions 包裹mutations,使之可以异步。Action 可以包含任意异步操作。
  • modules:模块化vuex。
  1. 在vue组件里面,通过dispatch来触发actions提交修改数据的操作。

  2. 然后再通过actions的commit来触发mutations来修改数据。

  3. mutations接收到commit的请求,就会自动通过Mutate来修改state里面的数据。

  4. 最后由store触发每一个调用它的组件的更新

Vuex的作用:项目数据状态的集中管理,复杂组件(如兄弟组件、隔代组件)的数据通信问题。
路由守卫参考vue-router

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值