手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜的Vultr , 注册 | 登陆
浏览模式: 标准 | 列表分类:Javascript

element-UI table如何按比例设置宽度

做后台,还真是首推ElementUI,毕竟规范,虽然东西比其他的少了一点,比如没有默认的ul/li效果之类的,但这些标准元素你可以引用一些第三方库,比如bootstrap,只要用他的CSS就行了。

当然,elementui也会有小问题,比如这次新版里推出的PopConfirm,好看是好看,但@confim/@cancel都没有(看官方的issue,有人提出是@onConfirm/@onCancel,但都没有用,也有人说是@on-confirm。。。。没有一一试,先用popup解决了)

这一篇说的是element-ui的Table组件,每个column都可以设置width,但这个width,因为没有单位,说不准是px?还是rem,如果一个表格的列不多,你这样设置的话,在大屏和小屏上面就很尴尬,要么全部偏左,要么撑破页面。因为他默认居然没有百分比设置(应该说width不支持百分比),但确实有人发现是可以支持,原来,el-table-column还有一个 min-width,这个就支持百分比,你可以设置<el-table-column min-width="15%"></el-table-column>,记得总数不要超过100%,否则还是会撑出或者会不起作用(总感觉有点妖)

 

Tags: element-ui

laravel mix extract之后.scss编译出来是空文件

 应该不算是我姿势不对吧,网上不少人有这个问题:https://github.com/JeffreyWay/laravel-mix/issues/1914

其实代码非常简单,如果是这样:
JavaScript代码
  1. mix  
  2.   .js('resources/front/visitors/visitors.js''public/js')  
  3.   .sass('resources/front/visitors/sass/visitors.scss''public/css')  
那就一切正常。如果加了这么一行:
JavaScript代码
  1. mix  
  2.   .js('resources/front/visitors/visitors.js''public/js')  
  3.   .sass('resources/front/visitors/sass/visitors.scss''public/css')  
  4.   .extract([....])  
则生成出来的visitors.css为空文件。生成空文件的时候,还认为自己是从几个vue文件里做了提取。但事实上scss这个文件是孤立的。不含在vue里(确实是有一个提取vuestyle的参数,但我没设置),laravel-mix的作者居然说:No, answer is don't upgrade if you're using dynamic imports. See the Mix 4 release notes.
 
评论里有人说实在不行就分成两个js文件来处理吧。嗯,事实上我也这样做了,比如我我因为前后台分开,就这么折腾的,但也会带来问题,比如,后一个生成的manifest.json会覆盖前面的(如果你不用{{mix()}}函数,那不会遇到这个问题,因为你不用它。。。但如果你用了,就会遇到各种不同的小问题,除非你放在一个mix.js文件里,只是用路由来解决)
 
最后我确实是分拆了,利用了concurrently,直接加了一个scripts:
JavaScript代码
  1. {  
  2.     "start":"concurrently \"npm:watch*\""  
  3. }  
执行npm run start,就OK了。如果你不想看完整的输出。上面的scripts中可以改成:
JavaScript代码
  1. {  
  2.     "start":"concurrently -r \"npm:watch*\""  
  3. }  
 
是的,你没有看错,就加了一个-r的参数
 

weui小程序安装出错:[WARNING] 找不到编译器:wepy-compiler-less。

 直接git clone weui小程序的项目,然后wepy build会出错。即使之前你运行npm install。

我是直接报:[WARNING] 找不到编译器:wepy-compiler-less。
解决方案不复杂:先npm install less 再 wepy build,一般就解决了。build的时候会自己安装wepy-compiler-less。
 
如果象我,还遇到下面的错误
npm WARN eslint-config-standard@7.1.0 requires a peer of eslint-plugin-promise@>=3.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN wepy-compiler-less@1.3.14 requires a peer of less@^3.8.1 but none is installed. You must install peer dependencies yourself.
npm WARN wepy-weui-demo@1.0.0 No repository field.
 
+ wepy-compiler-less@1.3.14
updated 1 package and audited 7975 packages in 3.378s
found 10 vulnerabilities (7 low, 3 moderate)
 
这时候就需要根据提示:npm install -g eslint-plugin-promise@>=3.3.0,进行安装(其实上面也有说,是因为less没有安装)
这样的话,其实问题就都好解决

Tags: weui, wepy, 小程序, npm

aliyun:One or more of the sp....

Aliyun oss 报错:  One or more of the specified parts could not be found or the specified entity tag might not have matched the part's entity tag.

 
报错是在multipartUpload方法中。如果要解决也很方便,在跨域设置中,暴露的headers中增加一个:ETag,即可,就是这么简单,但,真心花了不少时间处理(最后要看这里:https://help.aliyun.com/document_detail/32069.htm,如果用了分片,还是要再加一个:etag和x-oss-request-id)
 
有点小意外的是。AliOss的文档中有写:oss.put(name, object ),说是第二个参数支持File和Blob对象(嗯,在浏览器中)
  1. file {String|Buffer|ReadStream|File(only support Browser)|Blob(only support Browser)} object local path, content buffer or ReadStream content instance use in Node, Blob and html5 File
  2.   
然而在实际使用的时候,却是报错:TypeError: Must provide String/Buffer/ReadableStream for put.,这,简直是忽悠人啊。再比如说,multipartUpload,他说:
XML/HTML代码
  1. file {String|File(only support Browser)|Blob(only support Browser)} file path or HTML5 Web File or web Blob  
这回就真实是支持的。
----
难道区别就在于上面写的是:object local path而下面写的是 file path??
不管了。已解决。就是有点渗的慌
 
 
 
 
 
 

browser.min.js 报错:Cannot read property 'keys' of undefined

 在IE下,果然什么样的问题都会发生,为了兼容旧版浏览器,大家都知道要加载browser.min.js。然而。。。问题还是来了,就象标题那样。

查了一些资料,发现很多人都遇到过,原来。。。。居然是browser.min.js的版本太高了,降为 5.8.24 ,世界清静了
 
然而还是遇到一点问题,为了想用一些新的语法,用了<script type="text/babel">,但这样却导致vue 中的变量无法识别。尴尬 ,这一点还没有想到好办法
 
没办法用纯VUE进行开发,只能先PHP+VUE进行混写了

Tags: browser