JavaScript
12
Вклад в тег
Vue.directive('expand', {
inserted: function(el, binding)
{
if (binding.value !== null)
{
function calcHeight()
{
const currentState = el.getAttribute('aria-expanded')
el.classList.add('u-no-transition')
el.removeAttribute('aria-expanded')
el.style.height = null
el.style.height = el.clientHeight + 'px'
el.setAttribute('aria-expanded', currentState)
setTimeout(function()
{
el.classList.remove('u-no-transition')
})
}
el.classList.add('expand')
el.setAttribute('aria-expanded', (binding.value) ? 'true' : 'false')
calcHeight()
window.addEventListener('resize', calcHeight)
}
},
update: function(el, binding)
{
if (el.style.height && binding.value !== null)
{
el.setAttribute('aria-expanded', (binding.value) ? 'true' : 'false')
}
},
})
var app = new Vue({
el: '#app',
data: {
isExpanded: false
}
})import React from 'react'
import Helmet from 'react-helmet'
import { useIntl } from 'react-intl'
import messages from './messages'
export const Seo = () => {
const intl = useIntl()
const title = intl.formatMessage(messages.title)
const description = intl.formatMessage(messages.description)
return (
<Helmet
htmlAttributes={{ lang: intl.locale }}
title={title}
titleTemplate={`%s | ${title}`}
meta={[
{
name: 'description',
content: description,
},
{
property: 'og:title',
content: title,
},
{
property: 'og:description',
content: description,
},
{
property: 'og:type',
content: 'website',
},
{
name: 'twitter:card',
content: 'summary',
},
{
name: 'twitter:title',
content: title,
},
{
name: 'twitter:description',
content: description,
},
]}
/>
)
}import { Router, Route, IndexRoute, Redirect, IndexRedirect } from 'react-router'
import React from 'react';
export default (
<Router>
<Route path="/">
<IndexRoute/>
<Route path="test" />
<Route path="posts(/:page)" />
<Route path="article/:hrefTitle" />
<Route path="tags/:tagName" />
<Route path="tags/pages/(:page)" />
<Route path="archive(/:searchKey)" />
<Redirect path="*" to="/" />
</Route>
</Router>
)
