这可以在Vue.Js中传递计算属性中的参数.我可以看到当getter/setter使用computed时,他们可以获取一个参数并将其分配给变量.喜欢这里的文档:
// ...
computed: {
fullName: {
// getter
get: function () {
return this.firstName + ' ' + this.lastName
},
// setter
set: function (newValue) {
var names = newValue.split(' ')
this.firstName = names[0]
this.lastName = names[names.length - 1]
}
}
}
// ...
Run Code Online (Sandbox Code Playgroud)
这也是可能的:
// ...
computed: {
fullName: function (salut) {
return salut + ' ' + this.firstName + ' ' + this.lastName
}
}
// ...
Run Code Online (Sandbox Code Playgroud)
其中computed属性接受一个参数并返回所需的输出.但是,当我尝试这个时,我收到此错误:
vue.common.js:2250未捕获TypeError:fullName不是函数(...)
我应该使用这种方法的方法吗?
我正在尝试在组件中使用on click指令,但它似乎不起作用.当我点击组件时,当我在控制台中获得"测试点击"时,会发生无关紧要的事情.我没有在控制台中看到任何错误,所以我不知道我做错了什么.
的index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>vuetest</title>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
App.vue
<template>
<div id="app">
<test v-on:click="testFunction"></test>
</div>
</template>
<script>
import Test from './components/Test'
export default {
name: 'app',
methods: {
testFunction: function (event) {
console.log('test clicked')
}
},
components: {
Test
}
}
</script>
Run Code Online (Sandbox Code Playgroud)
Test.vue(组件)
<template>
<div>
click here
</div>
</template>
<script>
export default {
name: 'test',
data () {
return {
msg: 'Welcome to Your …
Run Code Online (Sandbox Code Playgroud) 我想在Vue.js
类似于vanilla javascript中进行重定向
window.location.href = 'some_url'
Run Code Online (Sandbox Code Playgroud)
我怎么能在Vue.js中实现这一点?
我用了创建了一个vue webpack
项目vue-cli
.
vue init webpack myproject
Run Code Online (Sandbox Code Playgroud)
然后在dev
模式下运行项目:
npm run dev
Run Code Online (Sandbox Code Playgroud)
我收到了这个错误:
无法加载资源:服务器响应状态为404(未找到)http:// localhost:8080/favicon.ico
所以在webpack里面,如何favicon.ico
正确导入?
我想将所有与服务器通信的函数放入VueJS中并将数据提取到一个可重用的文件中.
插件似乎不是最好的选择.模板较少的组件..?
我正在尝试在更改输入字段时使用Vue-router设置查询参数,我不想导航到其他页面但只想在同一页面上修改url查询参数,我这样做:
this.$router.replace({ query: { q1: "q1" } })
Run Code Online (Sandbox Code Playgroud)
但这也会刷新页面并将y位置设置为0,即滚动到页面顶部.这是设置URL查询参数的正确方法,还是有更好的方法.
编辑:
这是我的路由器代码:
export default new Router({
mode: 'history',
scrollBehavior: (to, from, savedPosition) => {
if (to.hash) {
return {selector: to.hash}
} else {
return {x: 0, y: 0}
}
},
routes: [
.......
{ path: '/user/:id', component: UserView },
]
})
Run Code Online (Sandbox Code Playgroud) 我正在尝试将键值对添加到现有的javascript关联数组中.关键需要是一个变量.这适用于JSON编码.我意识到有很多插件和框架,但我想要一个简单的答案.
ary.push({name: val});
Run Code Online (Sandbox Code Playgroud)
where ary
是一个新数组,name
是一个包含键的变量,val
是这个条目的值.
我在jQuery
循环中执行此操作,循环遍历表单字段.
我有两个嵌套组件,从父级访问子方法的正确方法是什么?
this.$children[0].myMethod()
似乎做了伎俩,但它很丑,不是吗,有什么更好的方法:
<script>
import child from './my-child'
export default {
components: {
child
},
mounted () {
this.$children[0].myMethod()
}
}
</script>
Run Code Online (Sandbox Code Playgroud) 我正在使用Vue 2.x和Vuex 2.x创建一个Web应用程序.我通过http调用从远程位置获取一些信息,我希望如果该调用失败,我应该重定向到其他页面.
GET_PETS: (state) => {
return $http.get('pets/').then((response)=>{
state.commit('SET_PETS', response.data)
})
},
error => {this.$router.push({path:"/"}) }
)
}
Run Code Online (Sandbox Code Playgroud)
但是this.$router.push({path:"/"})
给了我以下错误.
未捕获(承诺)TypeError:无法读取未定义的属性'push'
如何实现这一目标.
模拟JsFiddle:在这里
我有一个vuex商店,如下:
import spreeApi from '../../gateways/spree-api'
// initial state
const state = {
products: [],
categories: []
}
// mutations
const mutations = {
SET_PRODUCTS: (state, response) => {
state.products = response.data.products
commit('SET_CATEGORIES')
},
SET_CATEGORIES: (state) => {
state.categories = state.products.map(function(product) { return product.category})
}
}
const actions = {
FETCH_PRODUCTS: (state, filters) => {
return spreeApi.get('products').then(response => state.commit('SET_PRODUCTS', response))
}
}
export default {
state,
mutations,
actions
}
Run Code Online (Sandbox Code Playgroud)
我想调用变异:SET_CATEGORIES
来自变异:SET_PRODUCTS
,但这给了我错误:
projectFilter.js:22未捕获(在promise中)ReferenceError:未定义提交(...)
什么应该是正确的方法来做到这一点.我试过store.commit
和this.commit …
vue.js ×9
javascript ×7
vuejs2 ×4
vue-router ×2
vuex ×2
ecmascript-6 ×1
favicon ×1
html ×1
json ×1
service ×1
url-routing ×1
webpack ×1