小编Dja*_*ave的帖子

VueJS 组件未在 IE11 中呈现

我有一个像这样的小 Vue 应用程序:

<div id="app">
  <div class="row">
    <div>
      <statistic
        class-name="stat-1"
        :amount="amount"
        :postfix="postfix"
        :prefix="prefix"
        :scale="scale"
        :accuracy="accuracy"></statistic>
    </div>
    <div><!-- controls --></div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

JS:

Vue.component('statistic', {
  props: ['amount', 'postfix','scale', 'className', 'accuracy', 'prefix','fill'],

  /* config here */

  template:`<div class="animated-statistic" :class="className">
    <svg class="animated-statistic--graphic"  width="200" height="200" viewBox="0 0 200 200">
      <defs>
        <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="100%">
          <stop offset="0%" style="stop-color:rgb(249,232,154);stop-opacity:1" />
          <stop offset="100%" style="stop-color:rgb(229,107,233);stop-opacity:1" />
        </linearGradient>
      </defs>
      <circle cx="100" cy="100" :r="radius" fill="url(#grad1)"></circle>
    </svg>
    <div class="animated-statistic--text" v-text="value"></div>
  </div>`
});
Run Code Online (Sandbox Code Playgroud)

这工作得很好 -链接到工作 Codepen

但是,如果您在 IE11 中遵循相同的链接,则组件应位于的空白区域。除非我错误地使用 …

internet-explorer internet-explorer-11 vue.js

3
推荐指数
1
解决办法
6155
查看次数

如何使用 p5.js 计算圆上直线的交点

我有一条线 ( se),我知道它从圆内开始,并且我知道在圆外结束。我试图找到一条l线与圆相交的点。

计算圆中直线的交点 - 设置

我正在使用p5.j​​s库并且可以访问它的所有 Vector 函数。

我的想法是,如果我可以在线上与半径成直角,我就可以开始解决一些问题。

计算圆中直线的交点 - 尝试

// Get the vector between s and c
let scVector = p5.Vector.sub(start, circleCenter);
// Get the angle between se and sc
let escAngle = this.v.angleBetween(scVector);
// Get the distance between t (where the right angle hits the center of the circle) and c
let tcDistance = Math.sin(escAngle) * scVector.mag();
// Get the distance between t and where the line intersects the circle
let tlDistance = Math.sqrt(Math.pow(hole.r, 2) - …
Run Code Online (Sandbox Code Playgroud)

javascript math processing geometry p5.js

3
推荐指数
1
解决办法
1411
查看次数

bcrypt 在 Nodejs 服务器上非常慢

我的文件中有以下代码test.js

const bcrypt = require("bcrypt");
const { performance } = require("perf_hooks");

let hash = "$2b$20$v38KOyF2WSaJI/wcxSKN6u1iyvjfOu.Tjs3QHKCW2O4nCt0rTUgMu";
let password = "7!E:J|8yvGw$v]xXfKngkUAw3]EQ?B";

async function checkPassword() {
  let t = performance.now();
  if (await bcrypt.compare(password, hash)) {
    console.log("Passed! ", performance.now() - t);
  } else {
    console.log("Failed! ", performance.now() - t);
  }
}

checkPassword();
Run Code Online (Sandbox Code Playgroud)

然后我跑node test.js

我得到的输出是:

Passed!  59178.30090880394          < for a correct password
Failed!  59386.33465099335          < for an incorrect password
Run Code Online (Sandbox Code Playgroud)

对于基本检查来说,这几乎是一分钟!这是预期的结果吗?

我的 package.json 使用的是:

"dependencies": {
  "bcrypt": "^5.0.0",
  ...
Run Code Online (Sandbox Code Playgroud)

我在控制台中没有收到任何错误,一切都正确完成。我要散列的密码是

7!E:J|8yvGw$v]xXfKngkUAw3]EQ?B …
Run Code Online (Sandbox Code Playgroud)

bcrypt node.js

3
推荐指数
1
解决办法
2078
查看次数

Nuxt 链接到外部 url 在 URL 前添加斜杠

我有一个nuxt-link,如果我用 Vue 检查器检查元素,我会得到这样的东西:

在此处输入图片说明

注意to属性。但是如果我检查元素,果然href属性是不同的:

<p class="more-link-block">
  <a href="/https://www.forbes.com/sites/solitairetownsend/2020/11/16/100-uk-leading-environmentalists-who-happen-to-be-women/?sh=2b11cc462451" target="_blank" class="anchor-tag small-caps">
  Trending&nbsp;?
  </a>
</p>
Run Code Online (Sandbox Code Playgroud)

\已附加A。这在填充站点的 JSON 提要中不存在。

这是nuxt常见的“陷阱”,还是我需要做一些不同的事情?还是我需要提出问题?

nuxt.js

3
推荐指数
1
解决办法
2959
查看次数

您可以检查Samsung平板电脑默认Internet应用程序上的元素吗

是否可以使用默认的Internet应用程序检查三星平板电脑上的元素?我有一些需要排序的bug,这些bug仅出现在本机Samsung / Android“ Internet”应用程序中。

web-inspector samsung-mobile

2
推荐指数
1
解决办法
8888
查看次数

制作Laravel系列的副本

我正在尝试将一个集合的副本提供users给一个雄辩的模型jobs.所以我有效地拥有:

jobs : [
    1 : {
        users : {
            1: {}
            2: {}
            3: {}
        }
    }
    2 : {
        users : {
            1: {}
            2: {}
            3: {}
        }
    }
]
Run Code Online (Sandbox Code Playgroud)

一旦我得到这个,我将从另一个查询中总结一些数字,基本上为每个工作的每个用户提供一个总数,所以上面可能看起来像这样:

jobs : [
    1 : {
        users : {
            1: {
                total: 120
            }
            2: {
                total: 45
            }
            3: {
                total: 12
            }
        }
    }
    2 : {
        users : {
            1: {
                total: 32
            }
            2: {
                total: 4
            } …
Run Code Online (Sandbox Code Playgroud)

php laravel

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

Pinia / TypeScript 从操作中访问 getter — 类型上不存在属性

我有一家商店。

export const useGameStore = defineStore("game", {
  state: () => gameBaseState,
  getters: {
    foundMarkers(state): Marker[] {
      return state.markers.filter((m) => m.found);
    },
    ...
  },
  actions: {
    closeAll() {...},

    nextMissed() {...},

    previousMissed() {...},

    removeFlashId(id: string) {...},

    guess(pos: Coord) {
      ...

      if (this.foundMarkers.length >= this.toFind) {
        this.setScore();
        this.status = GameStatus.Passed;
      }
    },
  },
});
Run Code Online (Sandbox Code Playgroud)

在该guess()操作和所有其他操作中,找不到吸气剂值。我明白...

Property 'foundMarkers' does not exist on type '{ closeAll(): void; nextMissed(): 
void; previousMissed(): void; removeFlashId(id: string): void; flash(text: string, 
type?: string, t?: number): void; loadLevel(levelIndex: any): …
Run Code Online (Sandbox Code Playgroud)

typescript pinia

2
推荐指数
1
解决办法
2445
查看次数

Google电子表格搜索价值并在下一栏中查找价值

我有一个与分数相关的数字列表

    Number   Score
    1        1
    2        2
    3        4
    4        7
    5        10
    6        15
Run Code Online (Sandbox Code Playgroud)

我在他们自己的床单上有这些.让我们说另一张纸上的单元格A1的值为5,我想在另一张纸上查找5并返回10.我该怎么做?我发现了许多功能,如CHOOSE和INDEX,但没有工作示例.

google-sheets google-drive-api

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

jQuery中的Animate不透明度会留下ghost元素

当我为某些元素的不透明度设置动画时,似乎动画并不总是完成.我的工具提示的结果如图所示(复制,在div上来回摆动鼠标):

在此输入图像描述

方框1和方框2上面仍然有鬼元素.

这是我的jQuery

$(document).ready(function(){
    $(".thumbnail").hover(function(){
        $(this).parent().find(".tooltip").animate({
            opacity: 1,
            top: '105%'
        }, 200, 'swing', false);
        $(this).find(".label").stop(false, true).fadeIn(2); 
    },function(){
        $(this).parent().find(".tooltip").animate({
            opacity: 0,
            top: '100%'
        }, 200, 'swing', false);
        $(this).find(".label").stop().fadeOut();
    });

    $(".label").click(function(){
        var url = $(this).find('h3 a').attr('href');
        window.location.href = url;

    })
});
Run Code Online (Sandbox Code Playgroud)

还有一个小提琴:http://jsfiddle.net/qu7Tu/

jquery jquery-animate

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

使用PHP的Google Spreadsheets API - 致命错误:未捕获的异常

我正在尝试开始使用Google SpreadSheet API.我知道有很多其他语言,但PHP是唯一一个我模糊不清的语言.我在第一个障碍中不断下降并得到:

Fatal error: Uncaught exception 'Google\Spreadsheet\Exception' in 
/Users/djave/Google Drive/Sites/practise/gdata/lib/Google/Spreadsheet/ServiceRequestFactory.php:48 

Stack trace: #0 /Users/djave/Google Drive/Sites/practise/gdata/lib/Google/Spreadsheet/SpreadsheetService.php(37): 
Google\Spreadsheet\ServiceRequestFactory::getInstance() 
  #1 /Users/djave/Google Drive/Sites/practise/gdata/index.php(32): Google\Spreadsheet\SpreadsheetService->getSpreadsheets() 
  #2 {main} thrown in /Users/djave/Google Drive/Sites/practise/gdata/lib/Google/Spreadsheet/ServiceRequestFactory.php on line 48
Run Code Online (Sandbox Code Playgroud)

怎么回事:

步骤1下载并添加文件夹google-api-php-client

接下来,摆弄代码直到它工作

set_include_path('lib/');

require_once 'lib/Google/Client.php';
require_once 'lib/Google/Service/Books.php';

$client = new Google_Client();
$client->setApplicationName("Client_Library_Examples");
$client->setDeveloperKey("-------------------------------------");
$service = new Google_Service_Books($client);
$optParams = array('filter' => 'free-ebooks');
$results = $service->volumes->listVolumes('Henry David Thoreau', $optParams);

foreach ($results as $item) {
    echo $item['volumeInfo']['title'], "<br /> \n";
}
Run Code Online (Sandbox Code Playgroud)

结果:打印出书籍列表

步骤2下载并安装php-google-spreadsheet-client

首先,我将示例完全复制到我拥有的内容之后,然后包含所有正确的文件,直到找到所有内容:

set_include_path('lib/');

require_once 'lib/Google/Client.php';
require_once 'lib/Google/Service/Books.php'; …
Run Code Online (Sandbox Code Playgroud)

php google-app-engine google-api google-apps

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

过滤集合没有重复

我有一个类似下面的laravel集合:

[
   {
      "id":2,
      "name":"Product 1",
      "awards":[
         {
            "id":1,
            "name":"Award 1",
            "pivot":{
               "product_id":2,
               "award_id":1
            }
         },
         {
            "id":2,
            "name":"Award 2",
            "description":"Quae sint vero id iste.",
            "pivot":{
               "product_id":2,
               "award_id":2
            }
         },
         {
            "id":3,
            "name":"Award 3",
            "pivot":{
               "product_id":2,
               "award_id":3
            }
         },
      ]
   },
   {
      "id":3,
      "name":"Product 2",
      "awards":[
         {
            "id":2,
            "name":"Award 2",
            "pivot":{
               "product_id":3,
               "award_id":12
            }
         },
         {
            "id":3,
            "name":"Award 3",
            "pivot":{
               "product_id":3,
               "award_id":13
            }
         },
         {
            "id":14,
            "name":"Award 4",
            "pivot":{
               "product_id":3,
               "award_id":14
            }
         },
      ]
   }
]
Run Code Online (Sandbox Code Playgroud)

有没有办法,我可以获得如下的集合,所有奖项,没有重复:

      "awards":[
         {
            "id":1, …
Run Code Online (Sandbox Code Playgroud)

laravel

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

Laravel 在 __constructor 中向模型添加属性

我正在尝试向我的模型添加一个属性,这样我就可以说:$model->path然后返回一个 url。因此,我将以下内容添加到模型的构造函数中:

public function __construct($attributes = array()){

    $this->path = url('img/' . $this->{'file-name'});
    parent::__construct($attributes);

}
Run Code Online (Sandbox Code Playgroud)

但如果我运行,Model::first()我会得到以下结果:

{
  id: 25,
  text: "A lovely file",
  file-name: "file.jpg",
  created_at: "2016-02-12 11:44:37",
  updated_at: "2016-02-12 11:44:37"
},
Run Code Online (Sandbox Code Playgroud)

您会注意到没有path属性。我是不是做错了什么?!我想看看:

{
  id: 25,
  text: "A lovely file",
  file-name: "file.jpg",
  path: "http://myapp.app:8000/img/file.jpg",
  created_at: "2016-02-12 11:44:37",
  updated_at: "2016-02-12 11:44:37"
},
Run Code Online (Sandbox Code Playgroud)

作为记录,我也尝试过$this->field = 'value';,但也没有创建属性。

laravel

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

Vue将数据传递给子组件

我有一个问题,我试图将一个对象"通过"一个组件,即整体布局,传递给位于其中的子组件.我做了一个简化的例子,我基本上有一个<ul></ul>模板和一个<li></li>模板.

在创建它们时,我似乎正在丢失每个参考.当我创建它们时,我收到错误:

vue.js:1023 [Vue warn]: Error when evaluating expression "model.id": 
   TypeError: Cannot read property 'id' of undefined (found in component:
   <demo-list-item>)
Run Code Online (Sandbox Code Playgroud)

我究竟做错了什么?

我认为我对Vue的了解有一个根本的缺失......我真的,真的很新,并且正在从他们的网站上学习 - 所以这可能是一个非常明显/愚蠢的错误.

HTML:

<div id="app">
    <demo-list></demo-list>
    <script id="demo-list-template" type="text/x-template">
        <ul>
            <demo-list-item v-for="item in items"></demo-list-item>
        </ul>
    </script>
    <script id="demo-list-item-template" type="text/x-template">
            <li data-id="{{model.id}}">{{ model.name }}</li>
    </script>
</div>
Run Code Online (Sandbox Code Playgroud)

JavaScript的:

// define
var DemoList = Vue.extend({
    template: '#demo-list-template',
    data : function(){
        return {
            'items' : [
                {
                    'id' : 1,
                    'name' : 'this'
                },
                {
                    'id' : …
Run Code Online (Sandbox Code Playgroud)

vue.js

0
推荐指数
1
解决办法
2709
查看次数