小编Vuc*_*cko的帖子

为什么安全导航比在Rails中使用try更好?

我正在读这个.使用它有什么好处:

user&.address&.state
Run Code Online (Sandbox Code Playgroud)

过度

user.try(:address).try(:state)
Run Code Online (Sandbox Code Playgroud)

我还是不明白.

ruby ruby-on-rails-4

31
推荐指数
3
解决办法
7880
查看次数

如何正确对齐bootstrap表单按钮?

请告诉我如何使用bootstrap将此表单"登录"按钮对齐.我厌倦了使用拉右课.但调整大小后我的按钮位置不正确.

<div role="form">
    <div class="form-group">
        <label>Username</label>
        <input type="text" class="form-control"/>
    </div>

    <div class="form-group">
        <label>Password</label>
        <input type="password" class="form-control"/>
    </div>

    <div class="checkbox">
        <label>
            <input type="checkbox"> Remember Me
        </label>
    </div>

    <button class="btn-info btn">Log in</button>                            
</div>
Run Code Online (Sandbox Code Playgroud)

css css3 twitter-bootstrap

19
推荐指数
2
解决办法
7万
查看次数

Angular img src控制台错误

我正在使用ng-repeat打印所需文件夹中的所有图像,这些图像都在,<a>因为我正在使用fancyBox.

这是控制器的一个例子:

var ParentCtrl = function ($scope) {
    $scope.getTimes=function(n){ // for the ng-repeat
        return new Array(n);
    }; 
};

app.controller('projectController', ['$scope','$injector', function($scope, $injector) {
    $injector.invoke(ParentCtrl, this, {$scope: $scope});

    $scope.title = 'project';
    $scope.image_url = 'img/project/';
    $scope.image_num = 14; //image count -> [0.jpg, 1.jpg, 2.jpg, ..., 13.jpg]
}]);
Run Code Online (Sandbox Code Playgroud)

和模板:

<a href="" class="fancybox" rel="project-gallery"
    data-ng-repeat="t in getTimes(image_num) track by $index" 
    data-ng-href="{{image_url+($index)+'.jpg'}}">
        <img src="{{image_url+($index)+'.jpg'}}">
</a>
Run Code Online (Sandbox Code Playgroud)

这段代码工作正常,它显示了所有14个图像.但是,我在控制台中收到此错误:

GET http://localhost/projects/project-name/%7B%7Bimage_url+($index)+'.jpg'%7D%7D 404 (Not Found)
Run Code Online (Sandbox Code Playgroud)

如何解决这个错误?

javascript angularjs

15
推荐指数
2
解决办法
4365
查看次数

React Native - 如何制作边框图片?

我想将边框图像设为a View,类似于css中的border-image.

我怎么能实现它?

css reactjs react-native

13
推荐指数
1
解决办法
2480
查看次数

Vue CLI - 在静态文件中包含assets文件夹中的图像

是否可以assets/在某个静态.scss文件中包含一个图像,这个图像在一个静态文件中background-image

我有一个_buttons.scss部分和一些按钮有一个图标,我想添加为background-image.图标位于src/assets/foder中.

应用结构:

- src
  - assets
    some_icon.svg
  - components
  - scss
    _buttons.scss
    main.scss
  - views
  App.vue
  main.js
  router.js
Run Code Online (Sandbox Code Playgroud)

并在_buttons.scss:

.some-selector {
    background-image: url(../assets/some_icon.svg)

    /* also tried
    background-image: url(./assets/some_icon.svg)
    background-image: url(/assets/some_icon.svg)
    background-image: url(assets/some_icon.svg)
    */
}
Run Code Online (Sandbox Code Playgroud)

哪个返回错误This relative module was not found.

我知道我可以简单地在我的组件或主App.vue中添加这些样式(范围与否),但是,我想知道如果没有它可以实现这一点吗?

我也知道我可以在我的public文件夹中添加这些图标,但我希望图标保留在assets/文件夹中.

$ vue -V
$ 3.0.0-rc.5
Run Code Online (Sandbox Code Playgroud)

也许一些自定义webpack配置?

谢谢

webpack vue.js vuejs2 vue-cli

13
推荐指数
1
解决办法
5453
查看次数

Vue Chart.js - 条形图上的简单点/线

我需要在我的bar图表上添加一个简单的点/垂直线,它具有动态X值,0表示Y值.预览我需要的东西(红点):

在此输入图像描述

绿色值是动态的.

预览我目前的状态:

在此输入图像描述

其中3.30应该是点的X坐标 - [3.30,0].

我使用Vue的图表的图表和我尝试做创建一个混合的一个与barscatter,但scatter需要type: 'linear'为它的xAxis不适合我的需要的bar图表.

所以我尝试使用chartjs-plugin-annotation,它的box类型接受"坐标"但这里的问题是该X必须是X轴(labels对象)上的固定值.如果我放置X轴[3,0]它将起作用,但如果有一个十进制数,如[3.5,0],它将无法工作.


  // data
  options: {
    responsive: true,
    maintainAspectRatio: false,
    legend: {
      display: false
    },
    scales: {
      yAxes: [{
        ticks: {
          min: 0,
          max: 1,
          stepSize: 0.1
        }
      }]
    }
  }

  // computed 
  labels: [1, 2, 3, 4, 5, 6], // fixed …
Run Code Online (Sandbox Code Playgroud)

charts vue.js vuejs2 vue-chartjs

13
推荐指数
1
解决办法
1574
查看次数

Ruby on Rails请求在Google Chrome上待定

我不知道这是否是一个常见问题.但是我的Ruby on Rails应用程序中存在一个奇怪的问题.

例如在Chrome中:

当我单击link_to或者我尝试更改页面时,它将加载,加载和加载,页面不会简单地打开.要打开,我需要在另一个选项卡中单击"打开"并关闭当前选项卡,这样就可以正确加载页面.我不知道到底发生了什么,它刚刚开始从一个时刻发生到另一个时刻.

在Firefox中:

上面的问题没有发生,但它没有向我显示最新的HTML,除非我用F5刷新.然后它会显示除第一次以外的所有内容.

我使用Linux来运行我的项目,它是localhost.这两种情况都非常奇怪,我认为它们是以某种方式相关的.我已经清除了两个浏览器中的两个缓存.

更新:

正如建议搜索涡轮链接.我安装了宝石,但我唯一使用涡轮连接的地方就在application.html.erb.

<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
Run Code Online (Sandbox Code Playgroud)

例:

当我单击登录属性时,它是:

<li> <%= link_to "Sign up", new_member_registration_path, :class => 'navbar-link'  %> </li>
Run Code Online (Sandbox Code Playgroud)

该呼叫处于待处理状态且未移动(在Chrome上),这是一张网络图片:

在我的应用程序中链接到上面的网络状态的图片

在我的控制台日志中没有打印,没有任何东西只是被卡住而什么都不做.

javascript ruby ruby-on-rails

12
推荐指数
1
解决办法
530
查看次数

JQuery从JSON数组中获取数据

这是我从foursquare获得的JSON的一部分.

JSON

tips: {
    count: 2,
    groups: [
    {
        type: "others",
        name: "Tips from others",
        count: 2,
        items: [
        {
            id: "4e53cf1e7d8b8e9188e20f00",
            createdAt: 1314115358,
            text: "najja?i fitness centar u gradu",
            canonicalUrl: "https://foursquare.com/item/4e53cf1e7d8b8e9188e20f00",
            likes: {
                count: 2,
                groups: [
                {
                    type: "others",
                    count: 2,
                    items: []
                }],
                summary: "2 likes"
            },
            like: false,
            logView: true,
            todo: {
                count: 0
            },
            user: {
                id: "12855147",
                firstName: "Damir",
                lastName: "P.",
                gender: "male",
                photo: {
                    prefix: "https://irs1.4sqi.net/img/user/",
                    suffix: "/AYJWDN42LMGGD2QE.jpg"
                }
            }
        },
        {
            id: …
Run Code Online (Sandbox Code Playgroud)

javascript jquery json getjson

9
推荐指数
2
解决办法
10万
查看次数

将身高设定为100%

我需要将位于http://www.zorglegal.nl上的所有网页(主页除外)的主体放到相同的高度(100%浏览器高度),因此右边的棕色条从顶部到全屏拉伸底部.我怎样才能做到最好?

html{
    height: 100%;
}

body{
    min-height: 100%;
}
Run Code Online (Sandbox Code Playgroud)

不起作用.我还尝试为内容元素设置一个类,并尝试将其设置为100%高度,但这也不起作用.我怎样才能做到这一点?

棕色条是png图像,设置为全宽容器的背景图像.因此,如果该容器100%高,它应该工作.但是怎么样?

html css height

8
推荐指数
2
解决办法
2万
查看次数

在悬停时使用字母间距时保持宽度

我有一些基本的按钮样式,:hover我在其中添加了letter-spacing属性:

.btn {
  display: inline-block;
  text-align: center;
  background-color: transparent;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  border-radius: 0.25rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.btn-primary {
  background-color: #8065F1;
  color: #FFFFFF;
}

.btn-large {
  border-radius: 32px;
  box-shadow: 0 2px 80px 0 rgba(74, 74, 74, 0.23);
  padding: 0.25rem 3rem;
  font-size: 1.5rem;
  text-transform: uppercase;
}

.btn:hover {
  letter-spacing: 4px;
}
Run Code Online (Sandbox Code Playgroud)
<button type="button" class="btn btn-primary btn-large">Lorem</button>
Run Code Online (Sandbox Code Playgroud)

width没有不扩展的方法?喜欢添加min/max-width?然而问题是button元素可以包含不同的字符串长度:

.btn {
  display: inline-block; …
Run Code Online (Sandbox Code Playgroud)

css hover letter-spacing css-transitions

5
推荐指数
1
解决办法
741
查看次数