我尝试使用vue.js和Framework 7构建一个Cordova/Phonegap应用程序。我了解了如何在html元素中使用“v-on:click=“OnClick”属性来使用像“onClick”这样的函数。Framework 7已经在dom中实现了jquery。
但是有一个问题。我怎样才能直接访问dom,这样我就可以用jquery选择器选择整个css类了。比如:$('.likeButton')
.?
在offical framework 7中,我找到了类似下面的代码来访问dom及其函数:
this.$$ or this.Dom7
这是我已经在home.vue文件中写下的内容:
<script>
//import Fonts-awesome Icons
import FontAwesomeIcon from '@fortawesome/vue-fontawesome'
import {} from '@fortawesome/fontawesome-free-solid'
import F7Icon from "framework7-vue/src/components/icon";
import F7PageContent from "framework7-vue/src/components/page-content";
import * as Framework7 from "framework7";
export default {
name: 'FAExample',
components: {
F7PageContent,
F7Icon,
FontAwesomeIcon
},
methods: {
clickit: function () {
console.log("hi");
//this is what i have tested, looking if i have access to dom
let $$ = this.$$;
console.log($$);
},
//this is what i want to use
$('.likebutton').on('click',function () {
})
}
}
</script>
我希望你们能帮助我。我是vue.js和framework 7的新手。
谢谢你的帮助:)
2条答案
按热度按时间rkttyhzu1#
我们可以使用所有DOM函数,就像
例如,如果您想通过jquery隐藏某些内容,您可以使用如下代码:
要检查所有DOM函数,您可以查看官方文档。https://framework7.io/docs/dom7.html
但要确保你的DOM函数不应该在任何Window函数中。如果你在实现它时遇到错误,只需先创建“this”示例。
就像:var self=this;//使用此示例的全局变量
如果需要任何framework 7帮助,请在skyp上给我打个电话:萨加尔希曼5_1
dzjeubhm2#
您是否尝试过使用Vue的
$refs
?您可以设置对特定DOM元素的引用,然后在Vue中访问它。举个简单的例子:
然后在组件中:
您也可以从父级访问$refs。下面链接中的示例给出了详细信息。
有关$refs的更多信息:https://v2.vuejs.org/v2/guide/components.html#Child-Component-Refs