创建Sass文件

也是新建文件，后缀名改为 .scss或者 .sass ,这两种后缀名都属于 Sass语法，只是两者所使用的语法有些不同。

最近项目有个需求，需要整体都改大一号字体。心慌慌的全局替换了一下，还好没有出什么其他问题。不过这也引发了我的思考，有没有一种方式，把这些固定的样式写成一种变量，去预编译 CSS。然后我就找到了 Sass。

Sass 的安装

因为公司项目用 MUI 用得比较多，有碰到如下需求：

在与后台对接的时候，经常有时候会拿到一个空值 undefined，把 undefined 显示在页面上，对于普通用户来说，是不可行的。以下有一中简便的方便，快速替换 undefined。

这行代码的意思就是：如果值为false，那么就采用后面的，如果值为true，那么就采用前面的。

var myEntryStandard = ParentDelivery[i].EntryStandard||"无";

在项目中经常会遇到后台接口返回来的时间戳，我们需要转换一下才能显示日常使用的时间格式。

经常有这样的需求：子页面新增数据后完成后，跳转到父页面的列表界面。但是 MUI 采用的是页面跳转其实是打开新窗口，返回父页面并不会刷新父页面，只是把子页面关闭，父页面从始至终都在那里并没有刷新过。

在以往有讲过MUI 创建新页面 ，其中有提到 extras 传参。

在常规的前端开发中,我们经常使用a标签中的href属性来进行页面之间的跳转和传参.

但是这样会产生一个问题,a标签打开的页面返回时并不是返回到上一个页面,返回只是一个后退的操作.

如果对页面进行多次操作页面,当你想回到上一个页面时,就会来回的切换页面,严重影响体验.

在一个项目中,我们可以写一个公共的JS文件,创建新页面方法,代码如下.

//创建新页面
function openUrl(url, id, params) {
    if (typeof(params) == 'undefined') {
        params = {};
    }
    if (mui.os.plus) {
        mui.openWindow({
            id: id,          //url:新页面的地址
            url: url,        //id:新页面的 WebView ID
            extras: params,  //params:页面传参
            styles: {
                statusbar: {
                    //设置新页面状态栏背景颜色，以便达到沉浸式状态栏
                    background: '#3EAD74',
                    color: '#FFFFFF'
                }
            }
        })
    } else {
        window.location.href = url;
    }
}

引用 js 文件后就可以,我们可以用a标签进行快速的使用.

<a href="javascript:openUrl('url','id',{})">打开新的 webview页面</a>

我们可以很方便的用 a 标签进行传参，但是要注意的是，在动态生成的 DOM 结构里，用 a 标签来传参的话，页面跳转会失效。我的建议是用JS点击绑定事件进行页面的跳转和传参。