html 中的一些知识
这个是文本多余显示。。。的方法white-space: nowrap;overflow: hidden;text-overflow: ellipsis;安装 elementnpm i element-ui -S然后在main.js 添加就好了vue使用的操作main.js 的一些import Vue from 'vue'import App from ...
·
这个是文本多余显示。。。的方法
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
安装 element
npm i element-ui -S
然后在main.js 添加就好了
vue使用的操作main.js 的一些
import Vue from 'vue'
import App from './App.vue'
import router from "./router";
import store from './store/index.js'
import VueAwesomeSwiper from 'vue-awesome-swiper'
import 'swiper/dist/css/swiper.css'
import "./assets/css/normalize.css"
import $ from "jquery"
import mavonEditor from 'mavon-editor'
import 'mavon-editor/dist/css/index.css'
import VueParticles from 'vue-particles'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(mavonEditor)
Vue.use(VueAwesomeSwiper)
Vue.use(VueParticles)
Vue.use(ElementUI)
Vue.config.productionTip = false
new Vue({
router,
store,
render: h => h(App),
}).$mount('#app')
vue-store,存放的是vue关于全局的变量
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
const store = new Vuex.Store({
state:{
counter:1000
},
mutations:{
addStore(state){
state.counter++;
}
},
getters:{
kk(state){
return state.counter*5
}
}
})
export default store;
vue-router的使用,vue中的路由
import Vue from "vue"
import VueRouter from "vue-router";
Vue.use(VueRouter);
const main = () => import("../views/main/kk")
const pro = () => import("../views/profile/profile")
const funny = () => import("../views/funny/funny")
const study = () => import("../views/study/study")
const grow = () => import("../views/grow/grow")
const routes = [
{
path: "",
redirect: "/main"
},
{
path: "/main",
component: main
}, {
path: "/study",
component: study
}, {
path: "/funny",
component: funny
}, {
path: "/profile",
component: pro
}, {
path: "/grow",
component: grow
}
]
const router = new VueRouter({
routes: routes,
})
export default router
vue中 axios的配置
import axios from 'axios'
export function request(config) {
//创建实例
const instance = axios.create({
baseURL: "http://localhost:8080",
timeout: 5000,
headers:{
"Access-Control-Allow-Headers":"Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild",
"Access-Control-Allow-Origin": "*",
'Content-Type': "application/json;charset=utf-8"
}
})
// 发送真正的请求
return instance(config)
}
这个是 页面中markdown 的用法
<template>
<div>
<mavon-editor v-model="value"/>
</div>
</template>
<script>
export default {
name: "markdown",
data() {
return {
value: '',
defaultData: "preview"
};
},
};
</script>
<style scoped>
mavon-editor {
height: 1000px;
width: 100%;
}
</style>
这个是vue代理的酷炫背景
<vue-particles
color="#dedede"
:particleOpacity="0.7"
:particlesNumber="80"
shapeType="circle"
:particleSize="4"
linesColor="#dedede"
:linesWidth="1"
:lineLinked="true"
:lineOpacity="0.4"
:linesDistance="150"
:moveSpeed="3"
:hoverEffect="true"
hoverMode="grab"
:clickEffect="true"
clickMode="push"
class="lizi"
>
</vue-particles>
更多推荐
所有评论(0)