小编Ber*_*ert的帖子

如何在vue jsx中使用模板范围?

我定义了一个简单的子组件(testSlot.vue),如下所示:

<template>
    <section>
        <div>this is title</div>
        <slot text="hello from child slot"></slot>
    </section>
</template>
<script>
    export default {}
</script>
Run Code Online (Sandbox Code Playgroud)

我们可以在这样的html模板中使用它

<test-slot>
    <template scope="props">
        <div> {{props.text}}</div>
        <div> this is real body</div>
    </template>
</test-slot>
Run Code Online (Sandbox Code Playgroud)

但我如何在jsx中使用它?

jsx vue.js vuejs2

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

在托管代码中调用SSE代码(对齐)

这是我的问题:我们有一个用C++编写的数学库,它大量使用SSE.我们需要在我们的工具的托管层(使用C#编写)中使用相同的数学库.

问题是,数学库类必须是16字节对齐(SSE才能工作).但是,在编译托管代码时,我会遇到很多错误,因为不支持"__declspec(align(X))".

有什么想法是否可能以某种方式?我无法找到任何有用的信息.

一些其他信息:

用C++编写的数学库使用SSE来获得最大性能.但是,我们的工具不需要最高性能,与普通的C#代码相比,我们甚至可以获得性能提升.它更多的是能够实际执行我们所有的代码(它是一个巨大的代码库),而无需人们在数据类型之间来回转换.

所以这只是关于可用性,而不是关于性能.

我试过这个:我把所有的数学函数都放到cpp中,而不是把它们作为内联函数.现在它们从自己的DLL导出.然而,vector-class当然还有一个__m128私有成员用于其数据.

只要我将这样的变量放在托管代码中,编译器就会告诉我,我的托管代码现在是本机代码.

这是否意味着我的类定义中不能有这样的类型并将其完全隐藏在DLL接口之后?谢谢.

c# c++ sse managed alignment

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

Vue 1.x / 2.x:从$ route对象获取vue-router路径URL

众所周知,我们可以vue-route用来包装一些路径。

<!-- vue 1.x -->
<a v-link="{name: 'route_name', params: {id: 1}}"></a>
Run Code Online (Sandbox Code Playgroud)

在vue2中:

<!-- vue 2.x -->
<router-link :to="{name: 'route_name', params: {id: 1}}"></router-link>
Run Code Online (Sandbox Code Playgroud)

现在,我想显示供用户复制的链接URL,所以我想知道是否有办法从路由对象返回绝对路径URL?看来文档没有提及。

例如,我想要:

<template>
  <label>Copy the address</label>
  <input value="url" />
</template>

<script>
  export default {
    computed: {
      url() {
        const route = {name: 'route_name', params: {id: 1}};
        // !! The bellow shows what I may want.
        return this.$router.getLink(route);
      },
    }.
  };
</script>
Run Code Online (Sandbox Code Playgroud)

有这种方法吗?

mvvm ecmascript-6 vue.js vue-router vuejs2

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

如何在Vue.js中测试计算的属性?无法嘲笑“数据”

我想知道如何在Vue.js的单元测试中测试计算的属性。

我已经通过vue-cliwebpack基于)创建了一个新项目。

例如,这是我的组件

<script>
  export default {
    data () {
      return {
        source: []
      }
    },
    methods: {
      removeDuplicates (arr) {
        return [...new Set(arr)]
      }
    },
    computed: {
      types () {
        return this.removeDuplicates(this.source))
      }
    }
  }
</script>
Run Code Online (Sandbox Code Playgroud)

我试图像这样测试

it('should remove duplicates from array', () => {
  const arr = [1, 2, 1, 2, 3]
  const result = FiltersList.computed.types()
  const expectedLength = 3

  expect(result).to.have.length(expectedLength)
})
Run Code Online (Sandbox Code Playgroud)

问题(两个问题):

  1. this.sourceundefined。如何嘲笑或设置价值?(FiltersList.data是一个函数); …

javascript testing unit-testing vue.js vuejs2

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

将vuejs中的大括号更改为其他内容

是否可以将{{ msg }}vuejs中的大括号更改为其他内容,例如:{( msg )}

vue.js

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

检测长按两个项目列表视图

首先让我说我是Android开发的新手,但在C#,VB方面有很强的背景.

我已经阅读了大量关于类似问题的帖子并尝试了解决方案,但它似乎永远不会奏效.我确信这是我正在做的事情,这是基于我对编程语言的无知.

所以,我得到了ListAdapter的一些代码来填充Two Item List View.

import java.util.ArrayList;
...


public class ListAdapter extends BaseAdapter {

private Activity activity;
  private ArrayList<Integer> image;
  private ArrayList<String> list1;
  private ArrayList<String> list2;
  private static LayoutInflater inflater=null;

  public ListAdapter(Activity a, ArrayList<Integer> image, ArrayList<String> list1, ArrayList<String> list2) {
      this.activity = a;         
      this.image = image;
      this.list1 = list1;
      this.list2 = list2;
      ListAdapter.inflater = (LayoutInflater)activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);      
  }

  public int getCount() {
    return image.size();        
  }

  public Object getItem(int position) {
      return position;
  }

  public long getItemId(int position) {
      return position;
  } …
Run Code Online (Sandbox Code Playgroud)

android

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

从短代码动态注入Vue 2组件

我在管理区域中有一个表单,用户可以在其中输入包含短代码的文本:

在[temp c = 200]加热烤箱

我想要的是temp在前端显示时要解析并转换为Vue 2组件的短代码.

这是一个简化的Temperature.vue组件:

<template>
    <span class="temperature">
        {{ celsius }}&deg;C
    </span>
</template>

<script>
    import { mapGetters, mapActions } from 'vuex'

    export default {
        props: ['celsius'],
        name: 'temperature'
    }
</script>
Run Code Online (Sandbox Code Playgroud)

这是一个简化的Instructions.vue组件,它将使用短代码解析和呈现文本:

<template>
    <div v-html="parseShortcodes(text)"></div>
</template>

<script>
    import ShortcodeParser from 'meta-shortcodes'
    import Temperature from 'Temperature.vue'

    export default {

        data: () => {
            return {
                text: 'Heat oven at [temp c=200]',
                parser: ShortcodeParser()
            }
        },
        components: [
            Temperature
        ],
        methods: {
            parseShortcodes(text) { …
Run Code Online (Sandbox Code Playgroud)

vue.js vuejs2

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

在 Vue.js 中覆盖属性和方法的正确方法?

在 Vue.js 中使用mixin覆盖方法的正确方法是什么?我知道您可以使用 mixin 来模拟继承,但是假设您想扩展一些 props 但不完全覆盖整个 prop 值。

例如,我有一个 baseCell,但我还需要有类似的组件,但对于<td>s 和<th>s 的功能不同,所以我创建了两个额外的组件,它们使用 baseCell 作为 mixin。

var baseCell = {
  ...
  props: {
    ...
    initWrapper: {
      type: String,
      default: 'td'
    },
    ...
  },
  methods: {..}
};
Run Code Online (Sandbox Code Playgroud)

在组件中设置道具将完全覆盖所有值。

Vue.component('tableHeader', {
  mixins: [baseCell],
  props: {
    initWrapper: {
      default: 'th'
    }
  }
}
Run Code Online (Sandbox Code Playgroud)

我想出了一个合并属性的解决方案,但似乎有点笨拙,我不确定是否有更好的解决方案。

Vue.component('tableHeader', {
  mixins: [baseCell],
  props: Object.assign({}, baseCell.props, {
    initWrapper: {
      default: 'th'
    }
  })
});
Run Code Online (Sandbox Code Playgroud)

有了这个,我保留了 baseCell 道具,但传递了对象中的一些定义的道具。

javascript vue.js vuejs2

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

@Watch 装饰器未激活

我有一个简单的测试组件,模板如下所示:

<template>
  <div>
    <input type="text" v-model="name" class="form-control">
    <h5>{{ message }}</h5>
  </div>
</template>
<script src="./test.ts" lang="ts"></script>
Run Code Online (Sandbox Code Playgroud)

组件 TypeScript 如下所示:

declare var Vue: typeof Function;
declare var VueClassComponent: any;

import { Component, Inject, Model, Prop, Watch } from "vue-property-decorator";

@VueClassComponent.default({
  template: require("./test.vue"),
  style: require("./test.sass"),
  props: {
    name: String,
    num: Number
  }
})
export default class TestComponent extends Vue {
  name: string;
  num: number;
  message: string = "";

  @Watch("name")
  protected onNameChanged(newName: string, oldName: string): any {
    console.log("setting " + oldName + " to …
Run Code Online (Sandbox Code Playgroud)

typescript vue.js vue-component vuejs2

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

扩展vueJs指令v-on:单击

我是.我正在尝试创建我的第一个应用程序.我想在每次点击按钮时显示确认消息.

例:

<button class="btn btn-danger" v-on:click="reject(proposal)">reject</button>
Run Code Online (Sandbox Code Playgroud)

我的问题是:我可以扩展v-on:click活动以显示所有地方的确认吗?我会调用我的自定义指令v-confirm-click,首先执行确认,然后,如果我点击"确定",则执行click事件.可能吗?

vue.js vuejs-directive

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