大师网-带你快速走向大师之路 解决你在学习过程中的疑惑,带你快速进入大师之门。节省时间,提升效率

页面

页面是日常用语,指书籍或其他阅读类的其中一面。

vue router 刷新404问题

-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L] 3. nginx服务器配置 location / { try_files $uri $uri/ /index.html;

Angular4 不同页面中进行通信

Angular4 不同页面中进行通信 这里用的还是订阅者模式 深入理解Angular订阅者模式 我在项目当中用的是那个subject,在A页面操作成功发生一个通知到B页面 // rest.service.ts send(message: any) { this.subject.next(message); } // A页面发送消息 left.component.ts handleRoute(name) { this.router.navigate(['/' + name],{queryParams:{temp:this.temp}}); let title = queryParams.title; this.restService.send('who are you ?

上班之打嘴仗之“笨蛋最有杀伤力”

有一个哥们是做IOS的,要做一个分享功能,此功能要求分享的音乐内容,在新浪微博页面上直接带有播放按钮和进度条界面。即,可以在新浪微博上的页面里,直接点击播放音乐,而不需要再跳页面。 某天问到我这怎么搞,我就顺手百度了一个新浪微博的分享功能的“网页”API接口文档

《H5匠人手册》1:H5交互流程

《H5匠人手册》1:H5交互流程 最近一直在看网易出的《H5匠人手册》,能够全面的了解整个H5的产出流程,视觉实现和动效技巧,里面有很多网易出品的H5实例,干货很足,想要全面了解H5的建议可以买书配合书中的例子仔细体会;整理了其中一部分内容,后续会持续更新。 H5交互流程矩阵图 H5交互流程图 H5是为了传播而生的,是为了推广宣传内容、活动或品牌而制作的。目的

关于element el-button使用$attrs的一个注意要点

关于element el-button使用$attrs的一个注意要点 之前需要对el-button做二次封装,所以就用到vue的$attrs和$listeners属性,这两个属性在这不细说,可以在 这里 查看详情。 二次封装代码(limit-button) import { mapGetters } from 'vuex'; export default { props: { // 按钮唯一标识 buttonId: { type: String, required: true, }, }, computed: { .mapGetters(['getUserBtns']), validButton: function() { return env.debug ?

【Vue17】单页应用和多页应用

【Vue17】单页应用和多页应用 多页应用 每一次页面跳转的时候,后台服务器都会给返回一个新的html文档

node实现小程序登录全过程(登录+身份验证+返回token)

', formData: { appid: wx.appid, secret: wx.secret, js_code: req.body.code, grant_type: 'authorization_code' } };collection('Users'); app.use('/checkUser',checkUser) 运行后,显示如下: 调试台已经显示了后台返回的token。 我把app.js中的用户登录使用promise进行了封装,这样可以让我在运行小程序并打开index页面时,可以正常显示token,否则会出现异步登录未成功,页面就已经渲染完成,无法获取到token的现象。

同构(Isomorphic) web 是什么鬼?

同构(Isomorphic) web 是什么鬼? 最近遇到一个需求,需要快速开发一个可适配多种终端的H5 app,要求有比较好的用户体验(说白了就是界面切换快),同时也需要支持SEO(Search Engine Optimization),说人话就是对各种爬虫友好:)凭我个人经验来说对于体验要求高的H5,前端应尽量采取SPA(Single Page Application)架构,但是通常SPA无法做SEO,虽然可以单独为SEO写一套页面,但是这个工

ASP.NET Core 入门教程 6、ASP.NET Core MVC 视图布局入门

@ViewBag.Title Section Demo by ken.io @section footer{ Section Footer } 修改模板页 修改 _Layout.cshtml 增加Section加载 @ViewBag.Title - Ken.Tutorial Ken.Tutorial @RenderBody() @if(IsSectionDefined("footer")) { RenderSection("footer"); } 这里我们通过全局代码,将所有视图的母版页都指定为_Layout。 这样我们在视图子页面就不用逐一制定母版页了。 如果我们将Index.cshtml中指定的Layout注释掉 @{ //Layout = "_Layout";

ASP.NET Core 入门教程 7、ASP.NET Core MVC 分部视图入门

@ViewBag.Title PartialView With Params Demo by ken.io @await Html.PartialAsync("_NoteInfo", new NoteViewModel() { Title = "这是一个分部视图测试笔记", PublishTime = DateTime.Now, Body = "这是笔记的内容" }) 4、在控制器中编写对应Action 在控制器 PartialController.cs 中增加以下 Action: public IActionResult DemoWithParams() { return View();view=aspnetcore-2.1 本文首发于我的独立博客:https://ken.io/note/asp.net-core-tutorial-mvc-view-partial

移动端是怎么做适配的?

} 可以使用媒体查询查询不同尺寸时,应执行的样式内容。 @media(max-width:768px){ a{ . document.write(" html{ font-size: " + htmlWidth + "px} ") 这时,就可以使用rem的单位来进行书写宽度单位了。1em = 设备宽度(浏览器的宽度) 当设备尺寸变化的时候,页面的比例是没有变化的,可以很好的适不同移动端尺寸的效果。 使用示例 div{ width:0.5rem;

HTML页面加载速度优化

若压缩需要指定任务顺序,则需要引入run-sequence,return runSequence( 'task1-name','task2-name','task3-name'); var pngquant = require('imagemin-pngquant'); 参考文章 Web前端性能优化——如何提高页面加载速度 gulp-imagemin、gulp-tinypng-compress、gulp-tinypng-nokey图片压缩优化详解及对比 彻底理解浏览器缓存机制 web性能优化之:no-cache与must-revalidate深入探究 HTTP响应头之ETag 浏览器同域名请求的最大并发数限制

Electron+Mobx+React 开发记录(一)

babelrc ( babel配置文件 ) |---- [file] . module.exports = { devtool: 'source-map', entry: [ 'react-hot-loader/patch', 'webpack-dev-server/client?/app/index', ], mode: 'development', output: { filename: 'bundle.js', path: path.resolve(__dirname, 'dist'), publicPath: '/', }, resolve: { alias: { resources: path.resolve(__dirname, 'resources'), app: path.resolve(__dirname, 'app'), }, }, module: { rules: [ { test: /\. // 主界面加载 // @observable loadingMain = false;

用户登录前后端分离开发实战案例:React,npm,webpack,ES6, Kotlin, Spr

bin 目录下面的webpack脚本: image 打开脚本看到源码如下: #! 其中,元素 id = 'App' 是我们下面在index.html 中指定的 div 。 在 index.html中引用 webpack 打包生成的bundle.js, 代码如下: Hello React!value const data = { username: username, password: password }; = null, var success: Boolean = false, var msg: String = "" ) 测试 POST 接口 为了方便地进行测试,我们添加Spring Boot Actuator依赖到工程中: dependencies { .

UI自动化测试框架 ---TestCafe

UI自动化测试框架 ---TestCafe 因某个机会轻轻碰了一下TestCafe,感受到其强大,这里写个文档 运行结果: image.png test的前置条件 test.before(fun(t)):该test运行之前运行 test.after(fun(t)):该test运行之后运行 Demo fixture(`beforeeach test1`) . 参数化/数据驱动 其实就是创建一个对象,用for .@#$', } // 等等可能性的cases,这里随便造两个作为data driver ];browsers([ 'chrome', 'firefox' ]) // 错误自动截图 .

UI自动化的选型

UI自动化的选型 当前一切UI自动化都是建立在selenium2的API基础上的,最底层都是调用的模式。 UI自动化主要的体现应该在易用性、稳定性、可读性、可维护性、可扩展性当中。 Rebotframework +Selenium2library模式 Robot Framework是验收测试和验收测试驱动开发(ATDD)的通用测试自动化框架。它具有易于使用的表格测试数据语法,并使用关键字驱动的测试方法。其测试功能可以通过用Python

python selenium三种等待方式及详解

until(可执行方法, 超时时返回的信息) 这里需要特别注意的是until或until_not中的可执行方法method参数,很多人传入了WebElement对象,如下: WebDriverWait(driver, 10).

ABP 开发手记,通过做一个分类管理完整实现前后端代码

ABP 开发手记,通过做一个分类管理完整实现前后端代码 ABP 开发手记(Begin 2018-7-25) 7.25开始,启用5. } public bool IsLastNode { get; } } } #5.添加测试 跳过了 #6.Adding a New Menu Item,添加新菜单 找到 Relyto.CoreERP.Web.Mvc项目下AppAreaName\Startup\找到AppAreaNameNavigationProvider 类似这样: .jstree({ 'core': { data: treeData, multiple: false, check_callback: function (operation, node, node_parent, node_position, more) { return true;