小编har*_*ryg的帖子

从组件外部调用Vue.js组件方法

假设我有一个包含子组件的主Vue实例.有没有办法完全从Vue实例外部调用属于这些组件之一的方法?

这是一个例子:

var vm = new Vue({
  el: '#app',
  components: {
    'my-component': { 
      template: '#my-template',
      data: function() {
        return {
          count: 1,
        };
      },
      methods: {
        increaseCount: function() {
          this.count++;
        }
      }
    },
  }
});

$('#external-button').click(function()
{
  vm['my-component'].increaseCount(); // This doesn't work
});
Run Code Online (Sandbox Code Playgroud)
<script src="http://vuejs.org/js/vue.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="app">
  
  <my-component></my-component>
  <br>
  <button id="external-button">External Button</button>
</div>
  
<template id="my-template">
  <div style="border: 1px solid; padding: 5px;">
  <p>A counter: {{ count }}</p>
  <button @click="increaseCount">Internal Button</button>
    </div>
</template>
Run Code Online (Sandbox Code Playgroud)

因此,当我单击内部按钮时,该increaseCount()方法将绑定到其click事件,以便调用它.没有办法将事件绑定到外部按钮,我用jQuery监听其click事件,所以我还需要一些其他方法来调用increaseCount.

编辑

看来这很有效: …

javascript vue.js

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

Laravel迁移:即使指定,唯一键也太长

我正在尝试在Laravel中迁移用户表.当我运行迁移时,我收到此错误:

[Illuminate\Database\QueryException] SQLSTATE [42000]:语法错误或访问冲突:1071指定密钥太长; 最大密钥长度为767字节(SQL:alter table usersadd unique users_email_uniq(email))

我的迁移如下:

Schema::create('users', function(Blueprint $table)
{
    $table->increments('id');
    $table->string('name', 32);
    $table->string('username', 32);
    $table->string('email', 320);
    $table->string('password', 64);
    $table->string('role', 32);
    $table->string('confirmation_code');
    $table->boolean('confirmed')->default(true);
    $table->timestamps();

    $table->unique('email', 'users_email_uniq');
});
Run Code Online (Sandbox Code Playgroud)

经过一些谷歌搜索我遇到了这个错误报告,泰勒说你可以指定索引键作为unique()我做的第二个参数.它仍然给出了错误.这里发生了什么?

php mysql laravel

150
推荐指数
16
解决办法
21万
查看次数

在Laravel中,在会话中传递不同类型的Flash消息的最佳方式

我正在Laravel制作我的第一个应用程序,并试图让我的头围绕会话flash消息.据我所知,在我的控制器操作中,我可以设置一条flash消息

Redirect::to('users/login')->with('message', 'Thanks for registering!'); //is this actually OK?
Run Code Online (Sandbox Code Playgroud)

对于重定向到另一条路线的情况,或

Session::flash('message', 'This is a message!'); 
Run Code Online (Sandbox Code Playgroud)

在我的主刀片模板中,我有:

@if(Session::has('message'))
<p class="alert alert-info">{{ Session::get('message') }}</p>
@endif
Run Code Online (Sandbox Code Playgroud)

:正如你可能我在我的应用程序中使用自举3,并想使不同的消息类别的使用已经注意到alert-info,alert-warning,alert-danger等.

假设在我的控制器中我知道我正在设置什么类型的消息,在视图中传递和显示它的最佳方式是什么?我应该在会话中为每种类型设置单独的消息(例如Session::flash('message_danger', 'This is a nasty message! Something's wrong.');)吗?然后我需要为我的刀片模板中的每条消息添加一个单独的if语句.

任何建议表示赞赏

session laravel laravel-4

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

SQL仅在记录不存在时才插入表中

我想运行一组查询来将一些数据插入到SQL表中,但前提是满足某些条件的记录.该表有4个字段:( idprimary)fund_id,dateprice

我在查询3个字段:fund_id,dateprice.

所以我的查询会是这样的:

INSERT INTO funds (fund_id, date, price)
    VALUES (23, '2013-02-12', 22.43)
    WHERE NOT EXISTS (
       SELECT * 
       FROM funds 
       WHERE fund_id = 23
         AND date = '2013-02-12'
    );
Run Code Online (Sandbox Code Playgroud)

所以我只想在匹配fund_iddate不存在的记录时插入数据.如果以上是正确的,那么我觉得这是一种非常低效的方法,因为每次都必须运行一个额外的select语句.

有没有更好的方法来实现上述目标?

编辑:澄清既不是fund_id也不date是唯一的字段; 将存在共享相同fund_id或日期的记录,但没有记录应具有与另一个相同的fund_id和日期.

mysql sql sql-insert

64
推荐指数
3
解决办法
23万
查看次数

在Vue JS中,从vue实例内的方法调用过滤器

假设我有一个像这样的Vue实例:

new Vue({
    el: '#app',

    data: {
        word: 'foo',
    },

    filters: {
       capitalize: function(text) {
           return text.replace(/(?:^|\s)\S/g, function(a) { return a.toUpperCase(); });
       }
    },

    methods: {
        sendData: function() {
            var payload = this.$filters.capitalize(this.word); // how?
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

我可以在模板中轻松使用过滤器,如下所示:

<span>The word is {{ word | capitalize }}</span>
Run Code Online (Sandbox Code Playgroud)

但是如何在实例方法或计算属性中使用此过滤器?(显然这个例子很简单,我的实际过滤器更复杂).

javascript vue.js

54
推荐指数
4
解决办法
3万
查看次数

VBA将文件从一个目录复制到另一个目录

所以我有一个访问文件,我经常需要将其复制到另一个目录,替换最后一个版本.我想使用Excel宏来实现这一点,并且还希望在此过程中重命名该文件.

例如

   fileName = "X:\Database\oldName.accdb"
   copyDestination = "Y:\dbstore\"
   newName = "newName.accdb"
Run Code Online (Sandbox Code Playgroud)

有这么简单的方法吗?

vba copy

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

使用Vue.js从文本输入中按Enter键时阻止表单提交

我在我的应用程序中使用Vue.js并在表单中输入文本

<div id="myVueForm">
<form>
   <input type="text"  v-on="keyup:addCategory | key 'enter'">

   <!-- more form fields -->
   <button type="submit">Submit Form</button>
</form>
</div>
Run Code Online (Sandbox Code Playgroud)

在我的Vue实例中,我有以下内容

new Vue({
    el: '#myVueForm',

    methods: {
        addCategory: function(e)
        {
           if(e) e.preventDefault();
           console.log("Added a new category, thanks!");
        }
    }
});
Run Code Online (Sandbox Code Playgroud)

尽管有这样的preventDefault();调用,当用户在文本输入上按下输入时,表单仍然提交(尽管addCategory()方法确实触发).这种行为可以在这个小提琴中得到证明.

我知道我可以使用jQuery来捕获事件并阻止提交,但我想看看Vue是否可以这样做,因为它似乎是一种常见的用法.

html javascript vue.js

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

在TypeScript中使用导入类型的环境声明

我在我的TypeScript项目中有一个声明文件,如下所示:

// myapp.d.ts
declare namespace MyApp {
  interface MyThing {
    prop1: string
    prop2: number
  }
}
Run Code Online (Sandbox Code Playgroud)

这很好用,我可以在项目的任何地方使用这个命名空间,而无需导入它.

我现在需要从第三方模块导入一个类型并在我的环境声明中使用它:

// myapp.d.ts
import {SomeType} from 'module'

declare namespace MyApp {
  interface MyThing {
    prop1: string
    prop2: number
    prop3: SomeType
  }
}
Run Code Online (Sandbox Code Playgroud)

编译器现在抱怨它找不到命名空间'MyApp',大概是因为导入阻止它成为环境.

在使用第三方类型时,是否有一些简单的方法可以保留声明的环境效果?

typescript

28
推荐指数
2
解决办法
5468
查看次数

谷歌字体的跨源请求警告

我在我的网站上使用Google Webfonts.在Chrome控制台中,我收到以下警告:

Blink正在考虑拒绝不符合规范的跨域Web字体请求:http: //fonts.gstatic.com/s/raleway/v8/0dTEPzkLWceF7z0koJaX1A.woff2.请使用Access-Control-Allow-Origin使这些请求符合规范.

在检查请求标头时,似乎没有任何Access-Control标头存在:

Remote Address:109.231.231.219:80
Request URL:http://fonts.gstatic.com/s/raleway/v8/0dTEPzkLWceF7z0koJaX1A.woff2
Request Method:GET
Status Code:304 Not Modified
Request Headersview source
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8,en-GB;q=0.6
Cache-Control:max-age=0
Connection:keep-alive
DNT:1
Host:fonts.gstatic.com
If-Modified-Since:Mon, 04 Aug 2014 17:04:46 GMT
Origin:http://samarkanddesign.com
Referer:http://samarkanddesign.com/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/36.0.1985.125 Safari/537.36
Response Headersview source
Age:369865
Date:Fri, 08 Aug 2014 02:01:39 GMT
Expires:Sat, 08 Aug 2015 02:01:39 GMT
Server:GFE/2.0
Run Code Online (Sandbox Code Playgroud)

我该怎么做才能解决这个问题?任何人都可以解释正在发生的事情,因为我不完全了解CORS.在firefox和IE中查看的页面似乎阻止了字体请求.

需要注意的一点是,我正在公司网络上查看该网站.它可能有一个奇怪的设置或代理,剥离Access-Control标头.任何人都可以正常连接验证标头通常存在吗?该页面位于http://samarkanddesign.com

http access-control cors

17
推荐指数
1
解决办法
9316
查看次数

生成条带测试卡令牌以进行测试

我在我的应用程序中使用Stripe.我想编写一个集成测试,用于放置支票,检查Stripe是否创建了付款.我正在使用Stripe.js.

在我的测试中,我需要一个卡片令牌来执行测试费用.通常,此令牌将在客户端生成带有stripe.js并在请求中发送以执行计费.由于这只是服务器端测试,我可以通过某种方式在测试中生成令牌吗?

作为参考,测试将是这样的(使用PHP,但原理是相同的):

/** @test **/
public function it_creates_a_charge()
{
    $order = factory(Order::class)->create();
    $stripe_token = Stripe::generateToken([
                                          'card' => '4242424242424242'
                                          'exp'  => '04/2017',
                                          'cvc'  => '123'
                                          ]); // does not exist afaik

    $response = $this->post('charges/store', [
                'stripe_token' => $stripe_token,
                'order_id' => $order->id,
                //etc
                ]);

    // assertions...
}
Run Code Online (Sandbox Code Playgroud)

基本上我在问Stripe API中是否有允许生成服务器端令牌的东西.

php stripe-payments

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